在$ emit中接受参数-Vue

Question

使用$emit的非常简单的警报实现，但是在传递参数时，其行为就像从未发生过该事件一样。关于事件，我想将alert的值设置为结果。

我在坐骑时的监听方式是：

this.$eventHub.$on('alert', data =>       
  this.alert = data
})

会工作：

this.alert未定义，但已设置。

this.$eventHub.$emit('alert')

不起作用

：

this.alert从未设置，也从未听到过事件。

this.$eventHub.$emit('alert', {'message':'Signal Test', 'color':'error'})

这里发生了什么？

Answer 1

您可以在vue组件中使用this.$emit。 举个例子：

<template>
    <myComponent @customEvent="myCallback($event)" />
</template>

和脚本：

export default {
  methods: {
    myCallback(data) {
      console.log(data); // here you have your event data
    }
  }
}

在子组件中：

export default {
  methods: {
    onClick() {
      // this.$emit(eventname, data);
      this.$emit('customEvent', 'some data');
    }
  }
}

Answer 2

不一定是答案，而是更多的用户错误。问题是我在与监听事件相同的组件中发出事件信号。我使用了所有相同的代码，只是将侦听器移到了另一个组件上。

这可能是按设计的，但是我没有得到任何输出可在控制台中清楚地表明这一点，因此我不确定是否会出现这种现象或存在错误。

欢迎提供任何可能引起这种情况的答案！