Vue.component("button-counter",{
data:function(){
return{
count:0
}
}
template:'<button @click = "count++">{{count}}</button>'
})
new Vue({
el:"#app"
})
<div id = "app">
<button-counter></button-counter>
</div>
自定义局部组件
var component1 = {
template:`<div>组件1</div>`
}
var component2 = {
template:`<div>组件2</div>`
}
new Vue({
el:"#app",
components:{
"component-1":component1,
"component-2":component2
}
})
<div id = "app">
<component-1></component-1>
<component-2></component-2>
</div>