vue兄弟组件传递数据

vue兄弟组件传递数据的方式
例子：

  <div id="app">
        <zuozhe></zuozhe>
        <yonghu></yonghu>
    </div>
    <script>
        var bus=new Vue()//实例化一个vue，作为中央事件总线，利用它完成两个组件的交互
        Vue.component("zuozhe",{
            template:`    
            <div>
            <input type="text" ref="mytext">我是作者
            <button @click="handleClick()">发布</button>
            </div>
            `,
            methods: {
                handleClick(){
                    bus.$emit("message",this.$refs.mytext.value)
                    //bus.$emit和bus.$on的第一个参数必须一样（此处为message）
                }
            },
        })
        Vue.component("yonghu",{
            template:`          
            <div>
            我是用户
            </div>                               
            `,
           mounted() {//生命周期函数，当前组件dom创建完后就会调用
               bus.$on("message",(data)=>{
                   alert(data)
               })
           },
        })

        new Vue({
            el:"#app",
            data:{},
        })
    </script>