消息的发布和订阅

消息的发布和订阅

1.申请一个全局总事件

main.js

new Vue({
  el: '#app',
  components: { App },//注册
  template: '<App/>',//在指定作用域添加模板标签
//创建之前，申明一个全局事件总线
  beforeCreate(){
    Vue.prototype.$bus = this;
  }
})

2.先订阅

school.vue

//添加 npm install --save pubsub-js
import pubsub from 'pubsub-js';
---------------------------------------------
 mounted(){//页面渲染之后
    // 订阅
      this.pub33 = pubsub.subscribe('leave',(data,name) =>{
           console.log(name+"请假",data);
       })
    },
    beforeDestroy(){//毁灭之前 当组件摧毁取消订阅 退订
        pubsub.unsubscribe(this.pub33);
    }

3.发布

student.vue

import pubsub from 'pubsub-js';
export default {
    name:'Student',
    props:['stu'],
    methods:{
        leave(name){
            // 发布
            pubsub.publish('leave',name);
        }
    }
}