vue 事件匯流排問題

2021-08-16 03:30:51 字數 427 閱讀 8359

問題一:  不同元件傳值(非父子元件)

在main.js中,構建

eventbus = new vue();

pagea.vue

在methods中發布事件

eventbus.$emit('test', 123);

應該在pageb.vue生命週期creatd/mounted中觸發事件, 

eventbus.$on('test', (content) => );

問題二: 跳轉路由

pagea.vue在methods中進行路由跳轉,這時候就應在該元件被銷毀之前觸發:

beforedestroy (),

pageb.vue:應該在pageb.vue生命週期creatd/mounted中觸發事件, 

eventbus.$on('testclick', val => ,

Vue事件匯流排

相鄰元件之間可以通過this.emit 觸發父元件的事件並且傳遞引數 那麼隔著多個元件,如果一步到位,觸發對方的事件並且傳遞引數呢?vue.prototype.bus new vue 中,在vue原型上掛載this.bus.on datafroma function data 一般在mounted生...

vue 事件匯流排 eventBus

父元件向子元件傳遞引數用v bind 子元件向父元件傳遞引數用this.emit 兄弟元件傳參eventbus或者是用vuex進行傳遞 下邊說說eventbus 首先在src的assets的目錄下新建乙個vue bus.js檔案 import vue from vue export default ...

Vue事件匯流排(EventBus)

參考 問題背景 vue中除父子元件通訊外,任意兩個元件間的通訊問題。解決方案 1.使用vuex,共享乙個狀態,通過修改和監聽這個狀態實現元件通訊。2.事件匯流排。思路 根據vue.js文件,vm.on vm.off都是其實例方法,因此我們需要乙個vue例項作為事件匯流排物件。使用方式 第一種 將事件...