unniapp——使用uni.$emit()和uni.$on() 进行页面间通讯

最新推荐文章于 2024-08-05 09:48:11 发布

莫比乌斯的日落

最新推荐文章于 2024-08-05 09:48:11 发布

阅读量490

点赞数

分类专栏： uniapp 文章标签：面试前端 javascript

本文链接：https://blog.csdn.net/aliyun3/article/details/124156928

版权

本文介绍了在HBuilderX 2.0.0及更高版本中，如何使用uni.$emit()和uni.$on()进行App全局级别的页面通信。通过实例展示了从未登录状态到登录成功返回个人页面并显示用户信息的过程。讨论了事件监听、触发事件的操作，并提及了多种页面间通讯场景的应用，如Vue与NVue、Tabbar页面、父页面与子页面之间的通讯。

摘要由CSDN通过智能技术生成

自 HBuilderX 2.0.0 起支持 uni.$emit、 uni.$on 、 uni.$once 、uni.$off ，可以方便的进行页面的通讯，触发的事件都是 App 全局级别的，跨任意组件，页面，nvue，vue 等。事件详情

具体如何使用呢？我们假设一个场景，进入app,是未登陆状态，需要在我的页面点击登陆，进入登陆页

监听事件

首先，在我的页面监听事件。

面进行登陆。登陆成功之后，返回到我的页面，实时显示登陆后的用户信息。

// 我的页面  
onLoad(){  
    // 监听事件  
    uni.$on('login',(usnerinfo)=>{  
        this.usnerinfo = usnerinfo;  
    })  
},  
onUnload() {  
    // 移除监听事件  
        uni.$off('login');  
    },

因为事件监听是全局的，所以使用 uni.$on ，需要使用 uni.$off 移除全局的事件监听&