在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ 如何實現(xiàn)復(fù)合組件通信？

如何實現(xiàn)復(fù)合組件通信？

需求：用vue寫一個類似餓了么checkout組件，外面是包裹組件 里面是選項組件，要實現(xiàn)將選中的組件的id以數(shù)組的形式綁定到包裹組件上

問題：如果在選項組件上通過點擊調(diào)用封裝的dispatch方法在包裹組件上觸發(fā)相關(guān)事件，那只能在包裹組件外部監(jiān)聽該事件再調(diào)用相關(guān)方法綁定選中組件ID。如何才能在包裹組件內(nèi)部監(jiān)聽自定義事件觸發(fā)相關(guān)方法？也就是說如何在圖二中監(jiān)聽自定義事件，進(jìn)而在該組件中實現(xiàn)綁定選中的組件ID？
圖片描述

包裹組件

選項組件

相關(guān)計算屬性

回答
編輯回答
司令

wrap { mounted() {this.$on('item-click', handleItemClick)} }

item { methods: handleClick() { this.dispatch('item-click', id)}

2018年1月29日 18:42
編輯回答
墻頭草

抱歉沒有仔細(xì)看代碼就回答：
涉及到復(fù)雜的狀態(tài)管理或數(shù)據(jù)流動，非常推薦用vuex，可以大大提高后期維護(hù)效率。
當(dāng)某一個組件提交了狀態(tài)到vuex之后，其余的事情當(dāng)前組件就不關(guān)心了，其它組件會不會接收這個狀態(tài)，接收了會怎么主力都不再關(guān)心，而且通過chrome的vue devtool也方便調(diào)試。
如果單單是父子組件，那么emit和on肯定就足夠了。

2017年10月12日 16:36