1.全局组件
vue注册一个全局组件语法格式如下：
Vue.component(tagName, options)
tagName 为组件名，options 为配置选项。注册后，我们可以使用以下方式来调用组件：<tagName></tagName>
全局注册的组件只能在挂载的元素下使用，挂载的元素之外使用渲染不出来的，如果想在组件中使用实例中的数据，需要用到props传递（后面的笔记会讲到），直接使用是没有效果的。
1.全局组件
2.局部组件
局部组件是在实例选项中注册的，这样组件只能在这个实例中使用：
2.局部组件
var app = new Vue({
el:"#app",
data:{
name:'Helle Vue!',
},
components: {
'v-header':{
template: '<p>Hello</p>'
}
}
})
也可以将模板数据放在对象中存储
image.png
3.在组件写组件
<body>
<div id="app">
<v-header></v-header>
</div>
</body>
<script>
var vheaderchild = {
template:'<p>World</p>',
}
var vheader = {
template:'<p>Hello<v-header-child></v-header-child></p>',
components:{
'v-header-child': vheaderchild
}
}
var app = new Vue({
el:"#app",
data:{
name:'Helle Vue!',
},
components: {
'v-header':vheader
}
})
</script>
3.在组件写组件
网友评论