全局事件总线:组件之间的通信

全局事件总线:任意组件通信
  同级组件之中的通信

分析:让各个组件的实例对象vc,都可以访问到vue原型上的属性,方法
     给各组件之间提供通信的平台
//暴露出平台,各个组件都可以访问到
 main.js:   beforeCreate() {
             // 创建前  生命周期钩子
             //让各个组件的实例对象vc,都可以访问到vue原型上的属性,方法(组件找vc,vc没有,在找vue)
             Vue.prototype.$bus = this;
           }

 A给B传递信息  A->B:

     A: <button @click="send">传递信息给B</button>

      methods:{
         send(){
             //触发事件,把两个信息给B带过去
             this.$bus.$emit('v_b',this.msg,this.name);
         }
       }


     B: methods:{

           //两个参数接收了A组件发来的信息
           getA(value,name){
             console.log('我是B',value,name);
           }
         },

         mounted() {
           //全局绑定自定义事件
           this.$bus.$on('v_b',this.getA);
         }
       }

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值