之前學(xué)了那么久的Vue,對于組件間的通信啸罢,總是處于一看文檔就會,不看文檔就懵的狀態(tài),趁著最近做項目的記憶還清晰拣宏。趕緊記錄一下省的忘記
1涧尿、父給子組件通信
父給子通信,這種情況下一般都是用的props比較多
父組件在自身的子組件標簽上綁定要傳遞的數(shù)據(jù)名以及數(shù)據(jù),子組件接收用的是props配置項瞬矩,配置項中要聲明接收的數(shù)據(jù)的類型、默認值等配置锋玲。子組件想調(diào)用傳過來的數(shù)據(jù)就用this就行
2景用、子給父傳
子給父傳數(shù)據(jù)可以用自定義事件
當組件間的關(guān)系太過復(fù)雜時,就可以用消息訂閱或者全局事件總線來實現(xiàn)組件間的通信
在main.js中惭蹂,vm組件的beforecreated生命周期的鉤子中寫
Vue.prototype.$bus = this;
Vue中的任意一個組件就可以調(diào)用$on伞插,$emit來實現(xiàn)組件的傳參了