Skip to content

小程序开发:怎么在微信小程序的页面间传递数据

小程序开发:怎么在微信小程序的页面间传递数据
厦门商城系统开发

在微信小程序的开发中,我们经常会遇到页面间数据传输或相互影响的问题。在实际开发过程中,可以通过以下方法实现。

使用全局变量

全局变量实际上定义了一个全局对象,并在每个页面中引入。

当代码初始化时,小程序会读取一个app.js在这里,我们可以定义我们需要的全球变量。

然后在页面中,可以通过getApp()获取全局应用对象的方法可以读取和更改全局变量:

由于app.js该项目用于基本配置,因此不建议在这里配置许多变量。一般来说,这里会配置一些持久的常量,不建议使用这种方法来改变经常需要改变的量。

使用本地缓存

本地缓存是微信小程序提供的提供的一个功能,可以使用户生成的数据进行本地持久化,类似于NoSQL,可读取和修改。

那么,如何在不同的页面之间使用它来交互数据呢?

假设我们将用户信息保存在A页面上。

这样,数据就存在于本地。当需要使用B页时,可以直接获取数据池中的数据并进行CRUD操作:

需要注意的是,小程序在返回A页面时需要重新读取数据。此时,您可以选择将其放置在生命周期中onShow重新加载中对数据

父级数据传输到子级页面(模板)

我们通常在页面之间跳转和重定向。此时,我们可以选择在页面之间放置一些数据url里面,在新页面上初始化。

在D页面中,我们可以收到传输的参数:

wx.navigateTo和wx.redirectTo不允许跳转tab包含的页面只能使用wx.switchTab跳转。需要注意的是,wx.switchTab中的url不能传输参数。

新提供的微信wx.reLaunch接口可以输入参数。

此外,我们通常在页面上使用一些组件模板,因此父子之间会有相应的数据传输。

使用name属性,作为模板的名称。然后在这里使用is声明所需模板的属性。

然后将模板所需的data传入,如:

除变量外,传输到模板的也可以是事件方法的对象。例如,模板中的点击事件可以传输到使用模板的元素。

通过获取页面对象进行数据操作

该方法的本质是获取其他页面的对象原型,然后通过原型方法setData管理当前对象data修改如下:

跳转到下一页F后,假设F中有操作需要修改E中的数据,则可以使用以下方法:

该方法可可以操作页面堆栈中的页面数据,从而管理上级页面组的数据。

小结

在微信小程序中,页面间数据传输和交互不限于上述方式,可以在实际应用中结合使用。

一些常量,可以交由app.js管理;本地保存需要持久化的量。

通过传入参数,可以传入涉及下级页面或模板元素的数据。

后页可以通过获取堆栈中的页面对象快速修改上级数据。

结合实际应用,可以更好地管理小程序的数据

    码刀科技(www.lekshop.cn)是国内知名企业级电商平台提供商,为企业级商家提供最佳的电商平台搭建(多种模式电商平台搭建:B2B/B2B2C/B2C/O2O/新零售/跨境等)、平台管理系统开发及互联网采购解决方案服务, 联系客服了解更多.

    电子商务网站建设的重要性和好处