组件间通信--自定义事件

自定义事件实现通信的逻辑是给子组件的标签上绑定一个自定义事件。

在子组件中写触发事件,传入实参。

在父组件中定义具体事件方法体逻辑。

例如:

<!-- 
  绑定自定义事件xxx,实现子组件给父组件传递数据
-->
<Event2 @xxx="handler3"></Event2>

在子组件中使用defineEmits方法来触发自定义函数

    //利用defineEmits 方法返回的自定义函数来触发自定义事件  
    import { defineEmits } from 'vue'
    let $emit = defineEmits(['xxx'])
    $emit('xxx','华为手机','10万元')//触发子组件  第一个参数:事件类型 第二个|三个|N个参数即为注入的数据

父组件中handle3  方法接受,并定义方法体如下

 const handler3 = (params1, params2)=>{
    console.log(params1, params2)
  }

 

 

 

posted @ 2024-10-09 16:45  洛飞  阅读(4)  评论(0编辑  收藏  举报