vue -- 父子组件间的事件触发

1、父组件触发子组件事件

Parent.vue

<child  ref="child"></child> 

<div @click="fn">点击触发子组件中的事件</div>

methods:{
    fn(){
        this.$refs.child.clearTime();    //clearTime为子组件中的事件
    }
}

子组件Child.vue中只需要定义被父组件触发的事件即可，无需其他处理。

2、子组件触发父组件事件

子组件通过$emit触发父组件的事件，$emit后面的参数是向父组件传参;

//Child.vue
this.$emit('time','adoctors');

//Parent.vue

<topic @time="getTime"></topic>

methods:{
    getTime(val){
        console.log(val)   //'adoctors'
        ...                 //  其他的一些业务逻辑
    }
}