Vue.js 3 this.$root.$on不是函数 [英] Vue.js 3 this.$root.$on is not a function

查看:63
本文介绍了Vue.js 3 this.$root.$on不是函数的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个组件可以触发this.$root.$emit('some-root-event')LIKE

clickHandler: function() {
    this.$root.$emit("some-root-event", "aaaaaaaaaaaaaaaaaaaaaa");
    console.log('About $root.$emit')
}

内部的另一个组件应捕获此事件,但抛出错误:

this.$root.$on不是函数

第二个组件的代码如下所示

mounted() {
    this.$root.$on("some-root-event", (data) => {
        console.log("About listener catch $root some-root-event"); console.log(data)
    })
}

有人能帮我了解一下问题出在哪里吗?

推荐答案

根据this RFC在Vue.js 3中移除了$on$once$off实例方法:

他们的动机

Vue 1.x使用$dispatch$broadcast实现了类似于AngularJS的组件事件系统,其中树中的组件可以通过在树中上下发送事件进行通信。 在Vue 2中,我们删除了$dispatch$broadcast,取而代之的是更具状态驱动的数据流(道具向下,事件向上)。 使用Vue 2的API,$emit可以用来触发父组件声明性附加的事件处理程序(在模板或呈现函数中),但也可以用来触发通过事件发射器API($on,$off$once)强制附加的处理程序。这实际上是一个重载:完整的事件发射器API不是典型的组件间数据流的一部分。它们很少使用,实际上没有充分的理由让它们通过组件实例公开。因此,此RFC建议删除$on$off$once实例方法

这篇关于Vue.js 3 this.$root.$on不是函数的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆