vue 引入外部组件的正确写法应该是怎样的 5C

正确应该怎么写??我自己琢磨的,怎么写怎么错。。网上没有入门的说明,只有入门后的一堆说明。。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Vue 测试实例 - 菜鸟教程(runoob.com)</title>
<script src="https://cdn.staticfile.org/vue/2.2.2/vue.min.js"></script>
</head>
<body>
<div id="app">
    <runoob></runoob>
</div>

<script>
import runoob from './js/test.vue';    //引用
// 创建根实例
new Vue({
  el: '#app',
  components:{
    'runoob':runoob
  }
})
</script>
</body>
</html>
``
外部组件test.vue`
```<template>
    <h1>自定义组件!</h1>
</template>
<script>
    export default { 
        name: "runoob"     
    } 
</script>

<style>
</style>

3个回答

分别在两个template文件去定义组件,根组件和子组件

HTML文件里面不能导入.vue文件的,你这是在浏览器运行的话,内容是无法识别的,浏览器只支持.html文件,您需要用Vue CLI构建一个完整的项目,打包之后才能在浏览器运行

这样单独来行不通的, 你cli一个案列项目对着来

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问
相关内容推荐