Vue非父子組件通訊

1 . 新建一個事件中心的js,方便在每個地方使用。

//Bus.js文件
import Vue from 'vue';    
export default new Vue();   

2 . 使用方法

//A.vue文件
import Bus from 'Bus文件所在的目錄/Bus'
methods:{
    sent:(){
        //在此處提交給另一個組件
        //自定義一個事件名稱,我這裏叫做 'mu'
        //通過 '事件中心Bus' 來發送'mu'事件
         Bus.$emit('mu','我是向B.vue發送的數據')
    }
}
//B.vue文件
import Bus from 'Bus文件所在的目錄/Bus'
methods:{
    receive:(){
        //在此處接收 提交組件的數據
        //通過 '事件中心Bus' 來監聽 'mu'事件
         Bus.$on('mu','我是接收A.vue發送的數據')
    }
}
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章