uniapp中$off没写正确引发的问题~

你们好，我是金金金。

场景

我正在使用uniapp开发微信小程序，涉及到几个页面之间的事件通信，采用的是uniapp里面的$on和&off来达到页面之间的互相通信
功能如下：有一个选择城市的页面，当选择了某个城市，另外的几个页面左上角会显示当前选择城市的名称 以达到一致的效果
预期结果：选择了哪个城市几个页面都显示具体选择的城市名称
实际结果：当第一次进入页面选择的时候是生效的，此时退出页面在进入页面选择城市发现显示的还是之前选择城市的名称

• 下面贴出核心代码

a.vue代码如下，逻辑很简单，就是在页面挂载的时候监听全局的自定义事件，在组件卸载之前移除全局自定义事件监听器

b.vue代码如下，跟a.vue一样，就是在页面挂载的时候监听全局的自定义事件，在组件卸载之前移除全局自定义事件监听器

c.vue代码如下，再点击某个按钮的时候触发一个事件，同时会触发全局的自定义事件，附加参数都会传给监听器回调函数。

排查

1. 第一时间肯定是排查下代码，然后在事件里面写输出语句看是不是生命周期钩子写错了导致问题，结果发现：貌似并不是此引发的error

2. 接着看了看文档，重点看了看uni.$off，因为第一次进入页面选择 触发了事件，第二次就不正常了，是不是这个玩意把监听的卸载了

重点：看到这里，似乎明白了导致问题的原因是什么了

1. 如果只提供了事件名（eventName），则移除该事件名对应的所有监听器；我的a.vue里面就只提供了事件名，所以当第一个进入这个组件页面是生效的，当此时退出触发了卸载钩子把该事件名对应的所有监听器全部卸载了，那我其它页面也是用的这个事件名都被卸载了，那当然监听不到了
2. b.vue里面$on里面的回调写的也不对~

解决

• 同时提供事件与回调，并且在页面销毁前只移除这个事件回调的监听器，其余几个监听的页面都改成如下形成即可

测试

• 经过多次手动测试，多次选择城市几个页面显示的都是最新选择的城市名称，毫无问题~

总结

监听的时候提供事件与回调，并且移除的时候也一样同时提供相同的事件与回调

• 编写有误还请大佬指正，万分感谢。