63、非父子组件传值方式

//非父子组件传值
1.新建一个js文件 ,然后引入vue实例化vue,最后暴露这个实例
2.在要广播的地方引入刚才定义的实例
3.通过vueEvent.emit('名称',数据); 4.在接收数据的地方通过on接收广播的数据
vueEvent.$on('名称',function(){
....
})

//VueEvent.js

import Vue from 'vue';
var VueEvent=new Vue();
export default  VueEvent;

//组件一:广播

<button @click="emitNews()"></button>
import VueEvent from '../module/VueEvent.js'

methods:{
  emitNews(){
  VueEvent.$emit('to-news','传递的数据');
}
}

//组件二:接收

import VueEvent from '../module/VueEvent.js'

mounted(){
  
  VueEvent.$on('to-news',function(data){
  console.log (data);
});
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容