鍍金池/ 問答/HTML/ 一個vue組件之間的傳值問題？$emit(),$on()

一個vue組件之間的傳值問題？$emit(),$on()

圖片描述

圖片描述

如圖所示，網(wǎng)頁結(jié)構(gòu)就是一個頭部，一個路由組件，一個底部。
當我在組件1點擊方法，跳轉(zhuǎn)到組件2，同時提交 $emit() 事件，分別在頭部和組件2進行 $on 監(jiān)聽事件，頭部組件成功拿到值，并賦值到頁面成功，但是組件2能夠log出值，卻賦值不了。大概是因為頭部組件已經(jīng)事先注冊過了，所以傳值成功，我把組件2也拿到 render 里面先注冊，測試是傳值成功。

那么，我想經(jīng)過路由到另外一個組件（平級），如何進行傳遞數(shù)據(jù)呢？？初學，請大佬幫忙解惑。
請問router-view的兩個組件之間如何通信呢

回答
編輯回答
撥弦

https://segmentfault.com/a/11...

路由傳值
this.$router.push({path:'路徑',query:{所傳參數(shù)}}); 鍵值的形式所傳參數(shù)

2018年4月5日 22:59
編輯回答
別逞強

圖片描述

組件傳值主要分為子傳父通過emit觸發(fā)事件,父傳子是props和平級傳值,vuex在組件三種情況都可以傳值,還有cookie,localstorage和sessionstorage也可以傳值,但在vue中不建議使用,詳細介紹可以看哈https://cn.vuejs.org/v2/guide...

2017年8月18日 20:21
編輯回答
淚染裳

使用EventBus模式，vue-router都可以很方便的同級傳遞數(shù)據(jù)。如果你使用了Vuex那就更容易了。
組件2能打印出來值缺不能使用 需要貼再具體點兒的代碼看看…

2017年7月20日 09:47
編輯回答
放開她

大哥.$emit和$on是父子級傳遞數(shù)據(jù)的。
你需要平級的傳遞 完全可以使用vue-route的路由參數(shù)傳遞,如下:
a路由轉(zhuǎn)跳到b理由,直接傳參過去

router.push({ path: 'b路由', params: {xxx}})

然后,在B頁面通過watch屬性去監(jiān)聽$route,xxxx是你定義的回調(diào)函數(shù)

watch: {
    '$route': xxxx
  },
let xxxx = () => {
    console.log(this.$route)
}

通過this.$route去獲取傳過來的參數(shù)
第二個就是通過狀態(tài)管理去處理,如果你不想使用vuex那么就通過this.$root.$data去獲取
如果使用vuex就更加簡單了,直接看這里教程

2017年8月7日 04:19
編輯回答
慢半拍

子向父傳值用$emit，父向子傳值用$props，平級傳值官方?jīng)]有這個功能，你可以用vuex將值存在vuex里的state，然后在組件中取出

2017年12月3日 19:57