vue -- event trigger between parent and child components

1. The parent component triggers the child component event

Parent.view

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

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

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

The child component Child.vue only needs to define the event triggered by the parent component, and no other processing is required.

2. The child component triggers the parent component event

The child component triggers the event of the parent component through $emit, and the parameter after $emit is to pass the parameter to the parent component;

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

//Parent.vue

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

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