子元件傳值給父元件

2021-09-27 07:08:07 字數 1263 閱讀 2625

原理:

在父元件引用子元件時,通過事件繫結機制把乙個方法aaaa的引用傳給子元件,這個方法中可以有各種引數,子元件在觸發自己的函式或者某些資料發生變化時,觸發:事件繫結機制繫結的函式,通過引數的方式將要傳的值傳過來,父元件中處理,也就接到了子元件的值

最開始父元件本身有乙個方法 : fathermethods

父元件通過事件繫結機制,也就是 

@sendson="fathermethods"
方式傳值給子元件,注意,這裡是方法的引用,換句話就是把這個方法傳遞給子元件,而不是方法執行完以後的值,所以這裡不能加括號目的:把父元件的乙個方法傳給子元件

子元件中寫乙個事件會觸發乙個子元件本身的方法

子元件本身的方法sonedit,其中通過$emit操作父元件傳過來的sendson方法繫結的父元件的方法引用fathermethods,這時就觸發了父元件的方法

換句話說:子元件通過$emit出發了從父元件傳過來的方法

真正的父元件中並沒有呼叫這個show方法,只有傳給的子元件中呼叫了,呼叫就可以傳引數,那麼就在子元件中觸發時候傳引數

$emit在觸發父元件傳過來的值的時候,第乙個引數是方法名,從第二個起,後面均可以傳引數,

show方法裡面可以寫的是對引數的一系列操作,也就變相完成了從子元件向父元件傳值的需求

1 16 父元件傳值給子元件

react中需要將資料一層層向下傳遞,資料是單向資料流 import react,from react import reactdom from react dom import bootstrap dist css bootstrap.css 什麼是符合元件 將多個元件進行組合,例如呼叫2次cou...

vue 子元件給父元件傳值

子元件給父元件傳值的關鍵內容 在父元件中使用子元件,在使用時自定義事件型別和事件函式 在子元件中需要定義事件來定義事件型別 在子元件的methods中的事件函式中用this.emit 方法操作事件型別 在父元件的methods中操作自定義的事件函式 div id son father fatherd...

vue 子元件給父元件傳值demo

子元件向父元件傳值 1.子元件通過自定義事件向父元件傳遞資訊 傳送給爸爸資料 2.父元件監聽子元件的事件 總結 子元件向父元件傳值 子元件觸發乙個自定義事件父元件同時去監聽該自定義事件當子元件觸發自定義事件的時候,會把自定義事件拋向父元件,父元件觸發自定義事件的時候會執行對應的事件 爸爸頁面 爸爸的...