Events 具有多个组件的Vue 2和子组件事件

我已经阅读了问题/答案，虽然这在父级包含特定组件时有效，但在我的场景中，父级包含以下内容：

<component :is="currentView"></component>

然而，这是在听它自己的事情，而不是它的孩子。我还尝试给组件一个参考：

<component ref="main" :is="currentView"></component>

---

并使用

this.$refs.main.$on（'login'，doLogin）

，但是

$refs

对象直到初始渲染时才创建，因此无法进入

mounted（）

方法（太早）和

updated（）中

方法它将被重复调用，我确信这不是一个好主意。

您可以设置一个全局事件，然后将操作的名称作为有效负载的一部分传递，即

const登录={
模板：`Login`，
安装的（）{
此.$emit（'global-event'{
操作：“登录”，
数据：{
用户：“foo”，
},
})
},
}
常数更新={
模板：`Update`，
安装的（）{
此.$emit（'global-event'{
操作：“更新”，
数据：{
用户：“foo-bar”，
},
})
},
}
新Vue({
el:“#应用程序”，
数据：{
称为：{
更新：0，
登录名：0，
},
currentView:'登录'，
},
组成部分：{
登录，
更新，
},
方法：{
//在doSomething中，您将根据负载处理各种事件。操作
剂量计（有效载荷）{
这个.称为[payload.action]++
},
切换视图（）{
this.currentView=this.currentView=='login'？'update'：'login'
},
},
})

切换视图
{{调用}}

Gah！在花了很长时间搜索，什么也没找到，然后在这里发帖之后，我当然马上就找到了答案

但这只适用于控制子组件（我正在构建所有组件）的情况。在儿童中，您只需：

然后使用

this.$on（'login'，doLogin）

在父级中设置事件侦听器，就像在

created（）

方法中一样

---

我肯定会有这样一种情况：我使用的第三方组件只是调用

this.$emit（）

，目前，我在父组件中找不到任何替代

v-on:eventName=“handler”

。

是的，这就是我在问题中所说的“所有子组件必须使用相同的事件名称”。老实说，我真的不喜欢单处理器方法——维护起来更复杂。但请参阅下面我的答案，了解当您控制所有子组件时，我认为更好的选择是什么。这是一个选项，但通常不建议在其他vm上触发事件/设置参数。如果您可以避免，那么它允许您解耦组件：我同意-但是如果我的组件指定了它将创建的一组事件，那么在父级上激发和忘记（可以选择忽略它们）与在子级上显式侦听它们之间似乎没有什么区别。而且，没有v-on似乎没有办法做到这一点，在我的例子中，v-on将我的所有组件相互耦合，因为它们必须使用相同的事件名称！

<component ref="main" :is="currentView"></component>

this.$parent.$emit('login', {some: 'data'})