uni.$emit(eventName,OBJECT)
触发全局的自定事件。附加参数都会传给监听器回调。
其中eventName为事件名，OBJECT为触发事件附加参数
示例代码如下：
uni.$emit('update',{msg:'页面更新'})
uni.$on(eventName,callback)
监听全局自定义事件，事件由uni.$emit()触发，回调函数会接收所有传入的数。
eventName为事件名，callback为事件的回调函数。
示例代码如下：
uni.$on('update',function(data){ console.log('监听到事件来自
在uni-app中，页面间通信是一个常见的需求，特别是在构建复杂应用时。本文主要讨论的是如何通过uni.$emit()和uni.$on()实现这种通信。这两种方法是uni-app提供的一种全局事件总线机制，允许不同页面之间传递数据和触发事件。
uni.$emit(eventName, OBJECT) 是用来触发全局的自定义事件的。这里的eventName是你自定义的事件名称，而OBJECT则是你要传递的数据对象。例如：
```javascript
uni.$emit('update',{msg:'页面更新'});
```
上述代码会触发一个名为'update'的事件，并附带一个包含'msg'属性的对象，其值为'页面更新'。
然后，uni.$on(eventName, callback) 用于监听这些全局自定义事件。当事件被触发时，回调函数会被调用，并接收到所有传递的参数。例如：
```javascript
uni.$on('update',function(data){
console.log('监听到事件来自 update ，携带参数 msg 为：' + data.msg);
});
```
这段代码会在'update'事件被触发时打印出传递的msg参数。
这种通信方式在某些场景下非常有用，比如在移动端项目中，你可能使用自定义组件代替系统TabBar进行页面跳转。此时，如果某个页面（如微信支付成功页）需要返回TabBar页面并更新内容，普通的页面生命周期（如onShow）可能无法满足实时刷新的需求。这时，你可以通过在组件中调用uni.$emit()触发事件，然后在目标页面中使用uni.$on()监听并处理事件，实现页面动态更新。
具体应用示例：
在组件中，假设根据Tab的不同，我们需要更新不同的页面：
```javascript
onShow() {
switch (this.Tab) {
case 'demo':
uni.$emit('update',{msg:'页面更新'});
break;
}
}
```
在对应的demo页面中，我们在生命周期钩子中监听这个事件：
```javascript
created() {
uni.$on('update', (res) => {
this.list();
console.log(res, '更新');
});
}
```
值得注意的是，使用uni.$emit()和uni.$on()进行页面间通信时，存在一个关键的陷阱：**必须先打开或跳转到接收页面，然后再发射参数**，否则发射的事件将无效，接收页面无法接收到。这与传统的JavaScript事件模型相符，事件监听器必须先存在，事件才能被捕捉到。
另外，如果你发现一次接收无效，可能需要在发射事件时添加一个定时器，因为uni.$on的回调函数有时可能不会立即执行。不过，这种做法并不总是必要的，建议首先检查事件触发和监听的顺序是否正确。
虽然uni.$emit()和uni.$on()在某些情况下能很好地处理页面间的通信，但它们并不是万能的。在某些简单场景下，使用Vue的全局变量可能会更方便。例如，可以创建一个Vue的原型属性来存储共享数据：
```javascript
Vue.prototype.globalData = {};
```
然后在任何地方都可以访问这个全局数据对象，实现数据的共享。这种方法简单直接，但要注意避免数据污染和管理混乱。
uni-app提供了uni.$emit()和uni.$on()作为页面间通信的一种手段，但需要注意事件触发和监听的时机，以及在必要时使用定时器。在实际开发中，开发者应根据项目的具体需求和复杂性选择最合适的通信方式。
