微信小程序怎样传值到java,微信小程序——页面之间传递值

小程序页面传值的方式:

1.正向传值:上一页面 –>  下一页面

url传值

本地储存

全局的app对象

2.反向传值:下一页面 –>  上一页面

本地储存

全局的app对象

先说一下正向传值:

1.url传值:

通过url传值的需要通过option来获取参数值。

A页面:

wx.navigateTo({ url: 'test?id=1' })

B页面:

69c5a8ac3fa60e0848d784a6dd461da6.png

Page({ data:{ id:'', }, onLoad: function(option){ this.setData({ id:option.id }) } })

69c5a8ac3fa60e0848d784a6dd461da6.png

2.本地存储:

关于缓存,可以先访问小程序-数据缓存稍作了解。

A页面:

wx.setStorageSync('username', 'ddd')

B页面:

69c5a8ac3fa60e0848d784a6dd461da6.png

Page({ data:{ username:'', }, onLoad: function(){ var username = wx.getStorageSync('username') this.setData({ username: username }) } })

69c5a8ac3fa60e0848d784a6dd461da6.png

3.全局的app对象

关于app对象,可以访问小程序-注册程序了解相关信息。

A页面:

var app = getApp(); app.username='ddd';

B页面:

var app = getApp(); var username = app.username;

再说一下反向传值,看了上面那几种方法,聪明的你应该知道反向传值有哪几种方式了。对,就是方法2和方法3:

1.本地存储:

B页面:

wx.setStorageSync('username', 'ddd'); //返回上一页 wx.navigateBack();

A页面:

69c5a8ac3fa60e0848d784a6dd461da6.png

Page({ data:{ username:'', }, onShow: function(){ var username = wx.getStorageSync('username') this.setData({ username: username }) } })

69c5a8ac3fa60e0848d784a6dd461da6.png

2.全局的app对象

B页面:

var app = getApp(); app.username='ddd';

A页面:

69c5a8ac3fa60e0848d784a6dd461da6.png

var app = getApp(); Page({ data:{ username:'', }, onShow: function(){ var username = app.username; this.setData({ username: username }) } })

69c5a8ac3fa60e0848d784a6dd461da6.png

3.在当前页通过获取前一个 page 实例,再赋值

69c5a8ac3fa60e0848d784a6dd461da6.png

var pages = getCurrentPages(); var currPage = pages[pages.length - 1]; //当前页面 var prevPage = pages[pages.length - 2]; //上一个页面 //直接调用上一个页面的 setData() 方法,把数据存到上一个页面中去 prevPage.setData({ mdata:1 })

69c5a8ac3fa60e0848d784a6dd461da6.png

这种方法的弊端:因为进入 B 页面的入口可能是很多个。这样做,可能会导致获取到的页面实例不正确。

4.通过onfire.js为来实现这个效果

使用思路:

A 页面先订阅一个事件,并定义处理方法;

从 B 页面返回时,发送消息;

A 页面卸载时,解除订阅。

使用方法如下:

A页面代码如下:

69c5a8ac3fa60e0848d784a6dd461da6.png

var onfire = require("../utils/onfire.js"); var that; var eventObj = onfire.on('key', function () { // 当消息被传递时,做具体的事 }); Page({ data: { }, onLoad: function(options) { // Do some initialize when page load. }, onReady: function() { // Do something when page ready. }, onUnload: function (e) { onfire.un('key'); onfire.un(eventObj);//移除 } })

69c5a8ac3fa60e0848d784a6dd461da6.png

我们可以在 A 页面直接调用 onfire.on 方法,订阅一个名字为 key 的消息。在上面的代码中,消息附带的参数无传参。

如果需要传参的话,直接在 function 里增加参数即可,例如:

var eventObj = onfire.on('key', function (data){ // 执行操作 })

需要注意的是,一定要在 onUnload 里(在页面被关闭时)取消订阅消息,并取消绑定 eventObj。

B 页面里代码在回调的地方加入以下代码:

onfire.fire('key');//key 为上文中订阅的消息 // 有参数时 onfire.fire('key','test')

方法介绍完毕。各位看官好好享用~

参考文章:

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值