Vue中的事件總線:$bus


在vue中,我們父子之間通信簡單明了:

父組件向子組件傳值: props,

在父組件中,用   :要傳遞過去的名字 = “   要傳遞的值   ”。

在子組件中 使用props:{}接受即可

 

子組件向父組件傳值:$emit. 通過自定義方法,

在子組件中,我們使用this.$emit('方法名',參數),向父組件傳值

在父組件中,我們使用子組件傳遞過來的自定義方法 :    @自定義方法名 = “ 自己隨便寫一個方法名,不需要跟參數,在下面使用該方法時,再寫到()中 ”

 

 

以上,是關於vue中父子組件通信的方法,

那么非父子組件之間的通信,又是怎么樣的呢?

其實也很簡單,有兩種方法:

1.通過Vuex, Vuex中的state.是可以共用的屬性。通過調用Vue.state就可以獲取到,非父子組件之間通信就可以解決

2.通過$bus, 事件總線

   2.1 :  首先呢。我們需要去main.js 中  讓$bus可以使用: =======》     Vue.prototype.$bus = new Vue()

   2.2 :     然后,我們就可以使用 this.$bus.$emit(’事件名稱‘,參數)  發送

   2.3 :     最后,我們可以通過 this.$bus.$on('事件名稱',function(參數){})  接收

這樣。我們就可以通過事件總線獲取到非父子組件通信


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM