在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(參數){}) 接收
這樣。我們就可以通過事件總線獲取到非父子組件通信