Vue component
简易学习笔记,不涉及组件间数据交互【组件数据传递打算用vuex,另起一个例子】
基本实例 Base Vue Instance
new Vue({
el : "#root"
})
全局注册实例
Vue.component(tagName, options)
Vue.component('global-child',{
template : "<h1>this is a global component</h1>"
})
局部注册
let Child = {
template : '<h1>this is a local component</h1>'
}
注册子组件
new Vue({
el : "#root",
components : {
Child
}
})
HTML
<div id="root">
<global-child></global-child>
<child></child>
</div>
整理成一个文件
//全局组件
Vue.component('global-child',{
template : "<h1>this is a global component</h1>"
})
// 局部组件
let Child = {
template : '<h1>this is a local component</h1>'
}
//实例
new Vue({
el : "#root",
components : {
Child //子组件
}
})