浅谈使用JS库解决小程序跨页面传递消息和数据的方法（如何跨小程序页面传递值）

由于微信小程序wx.navigateBack的方法不支持返回和传递值，因此不方便在页面返回后立即更新数据。

一。需求分析

这种需求可能意味着:页面A进入页面B，页面B返回并将值传递给页面A或者当页面B触发事件时，页面A也有一个事件来触发更改。

商情分析

第一个:使用微信的wx.setStorage在小程序实例中缓存数据。从B页返回A页时，B页先缓存数据；然后在页面A的onshow方法中，调用wx.getStorage读取缓存。但是却为以后的维护带来了很多隐患。（类似于全局变量方法）

第二种方法:获取上一个页面实例也可以实现这个功能。部分代码如下:

这种方法的缺点:因为B页可能有很多入口。这样做可能会导致错误的页面实例。

二。方法简介

言归正传，介绍一下onfire.js（）

Onfire.js是一个非常简单的用于事件分发的JavaScript库（只有0.9kb），简洁而实用。它可以应用于:

1.简单的事件分布。

2.React、Vue.js和Angular中跨组件的轻量级实现。

3.活动订阅和发布。

如何使用:（做过移动开发的人都知道，类似于iOS的通知和Android的广播）

A.页面首先订阅一个事件并定义处理方法；

B.从B页返回时，发送消息；

卸载c.A页面后，取消订阅。

我的使用方法是:

页面代码:

我们可以直接在A页面上调用onfire.on方法来订阅名为key的消息。在上面的代码中，没有传递附加到消息的参数。如果需要传递参数，可以直接在函数中添加参数，例如:

需要注意的是，您必须取消订阅onUnload中的消息（当页面关闭时）并取消绑定eventObj。

b页面代码在回调处添加以下代码:

三。分析库代码

从代码中可以看到，在订阅on方法时，实际上调用了_bind方法。此方法使用二维数组存储订阅的对象。

fire消息发送方法的本质是调用_fire_func方法，通过名称（键）遍历订阅者，然后通知订阅者。调用un方法，按名称（键）遍历订阅者，找到后将其删除。

推荐:《小程序开发教程》

以上就是如何使用JS库解决小程序跨页面传递消息和数据的细节。更多资讯请关注主机参考等相关文章！

这几篇文章你可能也喜欢：

• 深入分析小程序模板的使用（小程序解析html的方法）
• 如何使用小程序中的组件组件？实用指南分享(小程序组件传值)
• 手把手教你如何在小程序中实现浮动按钮（代码示例）（小程序浮动按钮）
• 小程序如何配置Twoxml完美支持Markdown！（小程序配置教程）
• 下面来说说小程序中页面传递参数的几种方式（微信小程序页面传递值）。

本文由主机参考刊发，转载请注明：浅谈使用JS库解决小程序跨页面传递消息和数据的方法（如何跨小程序页面传递值） https://zhujicankao.com/102712.html