版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/qq379682421/article/details/80788192
###组件传参
父组件向子组件传递参数,通过属性传递
<todo-item v-for="(val,index) in list" :key="index" :centent="val"></todo-item>
// 定义一个全局组件,
Vue.component('todo-item',{
// 接受外部传递的参数
props:['centent'],
template:'<li>{{centent}}</li>'
})
子组件向父组件通信,子组件可以使用 $emit 触发父组件的自定义事件。
<todo-item v-for="(val,index) in list" :key="index" :centent="val" :index="index" @delete="deleteindex"></todo-item>
// 定义一个全局组件,
Vue.component('todo-item',{
// 接受外部传递的参数
props:['centent','index'],
template:'<li @click="handouclick">{{centent}}</li>',
methods:{
handouclick(){
// $emit 触发父组件的自定义事件
this.$emit('delete',this.index);
}
}
})