元件間通訊--自定義事件

洛飞發表於2024-10-09

自定義事件實現通訊的邏輯是給子元件的標籤上繫結一個自定義事件。

在子元件中寫觸發事件,傳入實參。

在父元件中定義具體事件方法體邏輯。

例如:

<!-- 
  繫結自定義事件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)
  }

相關文章