【vue】vue入门（二）

版权声明：本文为博主原创文章，未经博主允许不得转载。 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);
            }
        }
    })