1.父元件傳遞資料給子元件父元件資料如何傳遞給子元件呢?可以通過props屬性來實現
父元件:
//這裡必須要用 - 代替駝峰
data();
}子元件通過props來接收資料:
方式1:
props: ['childmsg']
方式2 :
props:
方式3:
props:
}這樣呢,就實現了父元件向子元件傳遞資料.
2.子元件與父元件通訊
那麼,如果子元件想要改變資料呢?這在vue中是不允許的,因為vue只允許單向資料傳遞,這時候我們可以通過觸發事件來通知父元件改變資料,從而達到改變子元件資料的目的.
子元件:
methods:
}父元件:
//監聽子元件觸發的upup事件,然後呼叫change方法
methods:
}3.非父子元件通訊
如果2個元件不是父子元件那麼如何通訊呢?這時可以通過eventhub來實現通訊.
所謂eventhub就是建立乙個事件中心,相當於中轉站,可以用它來傳遞事件和接收事件.
let hub = new vue(); //建立事件中心
元件1觸發:
methods:
}元件2接收:
created() );
}這樣就實現了非父子元件之間的通訊了.原理就是把hub當作乙個中轉站!
vue 非父子元件傳遞引數
參考學習 建立乙個事件中心,相當於中轉站,使用乙個空的 vue 例項作為 事件匯流排 可以用它來傳遞事件和接收事件,在乙個元件內呼叫emi t事件觸 發,另一 個元件內 呼叫 emit事件觸發,另乙個元件內呼叫 emit事件 觸發,另 乙個元件 內呼叫on進行事件繫結。new vue 某乙個元件內呼...
vue 父子元件傳遞
子元件接收父元件的資料可以使用props和bind進行 父元件 監聽子元件觸發的changehi事件,然後呼叫changehi方法 子元件 props cdata 接收父元件傳遞 父元件要監聽子元件的事件發生可以使用emit和on進行,子元件必須要觸發事件,然後父元件才可以接收到。子元件 metho...
Vue父子元件及非父子元件如何通訊
父元件資料如何傳遞給子元件呢?可以通過props屬性來實現 父元件 子元件通過props來接收資料 方式1 方式2 方式3 這樣呢,就實現了父元件向子元件傳遞資料.那麼,如果子元件想要改變資料呢?這在vue中是不允許的,因為vue只允許單向資料傳遞,這時候我們可以通過觸發事件來通知父元件改變資料,從...