vue中非父子组件的传值

1：利用vue的bus来进行数据传递。

2：利用vue的vuex来进行数据传递。

我们先来说第一个方法。

我们先给vue添加bus 

vue.prototype.bus=new Vue();//创建一个vue实例

在需要发送数据的组件添加 

this.bus.$emit('addData',"向兄弟组件传值") //其中第一个参数是自定义事件名，第二个是需要传递的数据。 一般写法如下： methods：{ clickFun(){ //点击事件（点击后触发当前事件然后发送数值到其他组件接收） this.bus.$emit('addData',"向兄弟组件传值") } }

当数据传递后，我们就需要在接收的组件添加接收函数

this.bus.$on('addData',(msg)=>{ //第一个参数是根据$emitd的自定义函数来写的，第二个是执行一个函数 console.log(msg) } ) 一般写在 mounted (){ var $this=this; //在$on里面还有函数所以作用域发生了改变，this，需要先保存下来 $this.bus.$on('addData',(msg)=>{ console.log(msg) }) }