1.组件与实例的关系
- 在一个Vue项目里面都是由n个实例所组成的,所以每一个组件也是一个实例。
- 比如以下:在组件里面写一个点击事件也是可以的。
<div id=root>
<div v-text="texts"></div>
<input v-model="inputValue" />
<button @click="handleClick">提交</button>
<ul>
<todo-item v-for="(item,index) of list" :key="index" :content="item"></todo-item>
</ul>
</div>
<script>
// 全局组件
Vue.component('todo-item',{
props:['content'],
template:'<li @click="handclick">{
{content}}<li>',
methods:{
handclick:function(){
alert('hello world')
}
}
})
</script>
2.全局组件和局部组件的区别:
- 全局组件可以在整个模板里面使用。
- 局部组件只能在挂载点里面使用。
<!DOCTYPE html>
&