vue.js的发布者与订阅者

介绍

就像一个微信公众号，它会定时推送内容，而订阅它的所有用户就会收到这个推送的内容

发布与订阅需要在同一个实例下才能够起效果
$emit - 发布者
$on — 声明订阅者
$once 订阅者只订阅一次消息（比如我订阅了一个公众号，它只给我推送了一个内容，我就把它取消订阅了，后续不会再收到）
$off 取消订阅（所有的订阅者只接受一次消息）

代码具体介绍

/*---------------------------html--------------------------*/
<div id="root">
    <input type="button" @click="fn" :value="num">  //当我点击这个按钮的时候，触发fn事件
</div>
/*---------------------------js--------------------------*/
   new Vue({
        el:"#root",
        data:{
            num:1
        },
        methods:{
           fn(){  //当这个事件触发的时候
                  // 发布一个名字为one的消息。
                  //当它发布这个消息以后，订阅这个消息的订阅者都会被触发
                  //第一个参数是你消息的名字，后面的是传的值
               this.$emit("one",1,2,3,4);
           }
        },
        mounted(){
            // 声明订阅者,订阅了一个名字为one的消息
            this.$on("one",(a,b,c,d)=>{
                this.$off("one");
                console.log(a,b,c,d);
            })
            this.$once("one",()=>{
                console.log(222222222222);
            })
        }
    })

结果展示：（点击 button 以后）