vue.js $emit,$on的使用

vue1.0中 vm.$dispatch 和 vm.$broadcast 被弃用，改用$emit,$on

vm.$on( event, callback )

监听当前实例上的自定义事件。事件可以由vm.$emit触发。回调函数会接收所有传入事件触发函数的额外参数。

vm.$emit( event, […args] )

触发当前实例上的事件。附加参数都会传给监听器回调。

例子：

//父组件

父组件使用v-bind:children1 ="children1把同一个event的对象传给做个子组件，

//子组件1

子组件1通过change()来触发$emit，将参数传递给子组件2。

//子组件2

子组件2通过绑定$on来监听组件1的值得变化,只要组件1的值随着按键离开的时候就会把这个值传给组件2.

总结：初次看这个用法的时候比较疑惑，主要是我们需要调用或者传递值给不同的组件，每个组件又在不同的页面，因此不知道let  Event = new Vue()这个对象怎么给不同的页面，必须明白只能是在同一个对象上面绑定$on和$emit才会起作用，后来发现只要在他们共同的页面把同一个对象分别传给不同的页面就可以了

 

 

二.

   还有一种方式就是直接用VUE导入文件的方式：

三.本文前面只讲了如何使用vue的绑定监听，但是也留下一个大坑，因为我们没有在页面销毁的时候及时注销实例，就会导致一个对象多次监听，并且造成程序执行顺序的异常，主要体现为一个事件，多次监听执行，因此必须使用

destroyed(){
    topologiesData.$off()
},

就是在页面销毁的时候，销毁绑定的监听实例

版权声明：本文为博主原创文章，未经博主允许不得转载。https://blog.csdn.net/lixiwoaini/article/details/80986762