$on $emit怎么传递信息

$on和$emit是Vue.js中用于组件之间通信的两个方法，可以通过它们来传递信息。
1. 在发送方组件中，使用$emit方法触发自定义事件，并传递需要传送的数据，例如：this.$emit('自定义事件名', 要传送的数据)。
2. 在接收方组件中，使用$on方法监听自定义事件，并接收传递过来的数据，例如：this.$bus.$on('自定义事件名', (params) => { console.log(params) })。
其中，$bus是Vue实例的一个属性，用于在不同组件之间传递信息。

相关问题

$bus.$on在created里父组件$bus.$emit传递的值

抱歉我之前理解错了你的问题。如果在子组件的 `created` 钩子函数中使用 `$bus.$on`，那么确实无法保证在父组件的 `$bus.$emit` 之前能够接收到值。这是因为在 `created` 钩子函数中，子组件还没有注册事件监听器。

为了解决这个问题，你可以将 `$bus.$on` 放在 `mounted` 钩子函数中，因为 `mounted` 钩子函数在组件挂载完成后执行，此时父组件的 `$bus.$emit` 已经触发了。

下面是修改后的示例代码：

// 子组件
export default {
  mounted() {
    this.$bus.$on('custom-event', data => {
      console.log(data); // 输出：传递给子组件的值
    });
  }
}

请注意，确保在不再需要事件监听时使用 `$off` 方法取消监听，以避免潜在的内存泄漏问题。

希望这次能解决你的问题！如果还有其他疑问，请随时提问。

$on, $emit

$on和$emit是Vue.js中的两个方法，用于实现组件之间的通信。

$on方法用于监听当前实例上的自定义事件。通过调用$on方法，可以在当前组件中监听指定的事件，并在事件触发时执行相应的回调函数。\[2\]例如，在子组件a中，可以使用Bus.$on('changeSelect', callback)来监听名为'changeSelect'的事件。当事件触发时，回调函数会被执行。

$emit方法用于触发当前实例上的自定义事件。通过调用$emit方法，可以在当前组件中触发指定的事件，并传递相应的数据。\[1\]例如，在子组件a中，可以使用Bus.$emit('changeSelect', data)来触发名为'changeSelect'的事件，并传递数据data。

总结起来，$on方法用于监听事件，$emit方法用于触发事件。它们可以在组件之间实现数据的传递和通信。
#### 引用[.reference_title]
- *1* [$emit,$on,$off--vue](https://blog.csdn.net/weixin_57844432/article/details/126599659)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item]
- *2* [$emit和$on 的使用详细演示](https://blog.csdn.net/weixin_35773751/article/details/109341465)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item]
- *3* [vue2 简单说明 $emit $on $off 的使用，防止$on多次触发](https://blog.csdn.net/mossbaoo/article/details/121262457)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item]
[ .reference_list ]