vue兄弟元件的傳值eventbus

2022-06-11 06:39:12 字數 546 閱讀 5549

注:當在a.vue元件上觸發點選事件時,就會觸發bus上監聽的事件,而bus事件監聽在b.vue裡面,這個時候就會觸發b.vue

上的事件監聽,而通過**函式,就可以拿到a.vue元件傳過來的資料,從而實現兄弟元件通訊。

###~~bus.js

import vue from "vue"

export default new vue()

parent.vue父元件

###~~a.vue元件

葉落森1

###~~~b.vue元件

葉落森2

注:可以在main.js寫(這是常用的方式)

vue.prototype.bus = new vue();

呼叫方法的時候直接書寫以下**就行

##~~a.vue

this.bus.$emit("bload");

##~~b.vue

mounted中寫:

this.bus.$on("bload",this.bload);

methods中寫:

methods:

vue 元件傳值 父子元件傳值,兄弟元件傳值

父向子 v bind props 子元件 子元件 props msg props接收 props 驗證 props food接受數值型別的引數,如果不傳入的話預設就是100 food fooe接受物件型別的引數 fooe foof使用乙個自定義的驗證器 foof foog props 是單向繫結的 ...

vue的兄弟元件傳值

1.通過狀態提公升 react叫狀態提公升,vue可能還有別的叫法 的方法去實現兄弟元件傳值 父元件 childrentsa元件 第乙個子元件 click me componentsb元件 第二個子元件 click me 注 狀態提公升那,其實就是把childrentsa元件中傳過來的值先在父元件中...

vue兄弟元件間傳值

舉例子說明,乙個元件中是input,監聽輸入的內容,在另乙個元件的div中顯示出來 首先在assets中建立個事件匯流排js檔案eventbus.js,檔案中的 如下 import vue from vue export default new vue 然後建立元件 inputcomponent,匯...