Vue组件传参---兄弟组件传参（非父子组件传参）

方案一（最简单兄弟组件传参解决方案）：

• 原理：使用一个空的 Vue 实例作为“中转站”，进行发送和接收数据。

1、在main.js中添加

• new一个空的Vue实例，并将其挂载在原型上

Vue.prototype.bus=new Vue();

2、ComponentA组件中

2、ComponentB组件中

---

方案二：

与方案一相比方案二代码更繁琐，不推荐使用。下方已经列出代码不同之处

1、新建bus.js文件

import Vue from 'vue'
export default new Vue

2、ComponentA组件中

import bus from '.../bus.js'

bus.$emit('sendMsg',this.Amsg)

3、ComponentB组件中

import bus from '.../bus.js'

this.bus.$on("sendMsg", val => this.BMsg = val);

---

方案三：

如果数据量大而杂，则可以使用VueX，我将在后续文章中举例其使用方法。