关于$on的问题

Question

1、this也是Vue的实例，为什么不能直接用this来$on绑定自定义事件
2、$on可以个一个事件名绑定多个回调的话，$emit的时候如何给回调传参啊

Answer 1

俊逸_ajay 2021-12-24 15:29:26

其实还有可以不用再创建一个空的vue实例，可以在项目创建vue实例时，在beforeCreate中给vue显示原型上新增一个属性：

//创建vm
new Vue({
    el:'#app',
    render: h => h(App),
    beforeCreate() {
        Vue.prototype.$bus = this //安装全局事件总线
    },
})

然后在所有该vue实例项目中使用了

this.$bus.$emit('hello',this.name)

在其它组件中调用，相当于沿着原型链一直往上找到$bus，而$bus存放的是vue的实例。

Answer 2

双越 2021-05-24 09:04:37

第一，因为自定义组件要用全局的，而 this 只是当前组件，而且这个组件有可能会接下来被销毁。所以，一定要有一个全局的、第三方的、永远不会被销毁的自定义事件对象。

第二，$emit 传递参数很简单，例如：

vm.$on('test', function (msg) {
    console.log(msg)
})
vm.$emit('test', 'hi')// => "hi"

• 提问者 ropeskipper #1

  感谢解答 
  但第二个问题我想问的是，一个事件名多次on绑定了多个回调，多个回调的参数不同，那样咋传参啊

• 双越 回复 提问者 ropeskipper #2

  这样设计不合理，一个事件就一个 on ，复杂度低。