vue组件之间通信（非父子之间通信）

视图如下：

单击点击后：

下列为实现代码：

html:

js:

//创建一个空的Vue用于存放数据
    let bus=new Vue({});
    Vue.component("brother",{
        template:"#brother",
        data(){
            return{
                msg:"我是你哥哥"
            }
        },
        created:{

        },
        methods:{
            gchan(){
                //将数据放入bus
                bus.$emit("tass",this.msg)
            }
        }
    });
    Vue.component("sbrother",{
        template:"#sbrother",
        data(){
            return{
                msg:"我是你弟弟"
            }
        },
        mounted:{

        },
        methods:{
            change(){
                //监听bus，发生变化的时候，改变msg。
                bus.$on("tass",(val)=>{
                    this.msg=val;
                })
            }
        }
    });

    new Vue({
        el:"#app"
    })