this.$on和this.$emit的组件通信方法

this.$on和this.$emit是Vue.js中组件之间通信的方法。

this.$on用于在当前组件上监听一个自定义事件。当该事件被触发时，会执行对应的回调函数。可以通过this.$on(eventName, callback)来绑定事件监听器。

this.$emit用于触发一个自定义事件。可以通过this.$emit(eventName, data)来触发事件，并传递数据给其他组件。

在给定的代码示例中，Student组件通过this.$bus.$emit('hello', 666)触发了一个名为hello的自定义事件，并传递了数据666给School组件。

而School组件则通过this.$bus.$on('hello', (data) => { console.log('我是School组件，我收到了数据：', data); })监听了hello事件，并在回调函数中打印出收到的数据。

这样，Student组件通过this.$emit触发了一个事件，而School组件通过this.$on监听到了这个事件，并执行了相应的代码，实现了组件之间的通信。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* [[vue] 全局事件总线 this.$bus.$emit this.$bus.$on ，可以实现任意组件间通信](https://blog.csdn.net/qq_14993591/article/details/121221114)[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^v92^chatsearchT0_1"}}] [.reference_item style="max-width: 50%"]
- *2* *3* [组件之间使用this.$bus.$emit()，this.$bus.$on()， this.$bus.$off(event)](https://blog.csdn.net/Cool_so_cool/article/details/116234145)[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^v92^chatsearchT0_1"}}] [.reference_item style="max-width: 50%"]
[ .reference_list ]