Vue组件

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>