思路：

在assets文件里建一个bus(自己取名的).js文件（专门用来传递消息的公共的★js文件★），引入vue，实例化vue，暴露实例；

在兄弟组件里引用；

兄弟传值一方用  bus.$emit("自定义方法名"，“数据”)；

兄弟接受一方用  bus.$on("和emit方法名一致"，val=>{

this.news=val;

})；

ps：接受或者发送都可以使用created、mounted实现，比如笔者在接受时候使用了mounted接受数据

目录图示：

bus.js:

import Vue from 'vue';
export default new Vue;

A.vue:

<template>
	<div>俺是a组件
	<button @click="sedMsg">发送消息</button></div>
	
</template>

<script>
	import bus from '@/assets/bus.js'
	export default{
		data(){
			return{
				aSend:"兄弟a的信"
			}
		},
		methods:{
			sedMsg(){
			bus.$emit("msg",this.aSend);
			}
		}
	}
</script>

<style>
	div{
		height:150px;
	background-color: #008080;
	}
	button{
		display: block;
	}
</style>

B.vue:

<template>
	<div>俺是b组件
		<p>{{news}}</p>
	</div>
</template>

<script>
	import bus from '@/assets/bus.js'
	export default {
		data() {
			return {
				news:''
			}
		},
		methods:{
			getMsg(){
				bus.$on('msg', val => {
					this.news=val
				})
			}
		},
		created() {
			this.getMsg();
		}
	}
</script>
div{
height:150px
background-color: #9d94bd;
}

<style>
</style>

App.vue:

<template>
  <div id="app">
	  <A></A>
	  <B></B>
  </div>
</template>
<script>
	import A from '@/components/A.vue'
	import B from '@/components/B.vue'
	export default{
		components:{
			A,
			B
		}
	}
</script>
<style>
	#app{width: 300px;height: 300px;margin:10% auto;text-align: center;}
	
</style>

main.js(把没用到的module去掉了)：

import Vue from "vue";
import App from "./App.vue";

Vue.config.productionTip = false;

new Vue({
  render: h => h(App)
}).$mount("#app");

ps：如果不想'xxx' is defined but never 报错，在.eslintrc.js文件，在rules里面添加 

 "no-unused-vars": 'off'

如下图：