微信小程序> 小程序三个页面之间传参

小程序三个页面之间传参

浏览量:887 时间: 来源:Rechal_Mei

三个页面的传递参数,这一次我想实现的事我在后台取到的数据,展现在A页面传递到B页面展示,B传递到C页面展示。

主要思路:A到B先把B页面的值取出来并setdada出去   然后在从B传单C。

主要代码:

test.wxml

                   

view class='tiyan' style="background-image: url('{{clock_img}}'); "

view class='mask'

view class='tiyan1'{{clock_title}}/view

view class='tiyan2'{{counts}}人参加|{{comm}}次打卡/view

/view

 test.js  

需要传递的参数,传个下一个B页面,照片的形式用的缓存传递的

join: function(e) {

//向下一个页面传递的参数

var id = e.currentTarget.dataset.id

var clock_title = e.currentTarget.dataset.clock_title;//名字

var comm = e.currentTarget.dataset.comm;//打卡次数

var counts = e.currentTarget.dataset.counts;//参与人数

var clock_img = e.currentTarget.dataset.clock_img;//套餐背景

wx.setStorageSync('clock_img',clock_img)

// console.log(clock_img);

// console.log(id, "套餐id")

// console.log(e.currentTarget.dataset,"11")

wx.navigateTo({

url: "./test-1/test-1?project_id=" + id + '&clock_title=' + clock_title + '&comm=' + comm + '&counts=' + counts

})

},

test-1.wxml 

view class='tiyan' style="background-image: url('{{clock_img}}'); " bindtap='join'

view class='mask'

view class='tiyan1'{{clock_title}}/view

view class='tiyan2'{{counts}}人参加|{{comm}}次打卡/view

/view

/view

test-1.js   

接收数据要在onload函数里接收A页面传递的参数

Page({

/**

* 页面的初始数据

*/

var project_id;

data: {

//顶部套餐信息

clock_title: "",

counts: "",

comm: "",

clock_img: '',

}

onLoad: function (options) {

// 接收上个页面的值 必须在这个方法中 打印一下就有了

console.log(options,"接收test的数据");

var clock_img = wx.getStorageSync('clock_img')

// console.log(clock_img);

this.setData({

clock_title: options.clock_title,

counts: options.counts,

comm:options.comm,

clock_img: clock_img,

project_id:options.project_id

},function(){

wx.removeStorageSync('clock_img')

})

},

//立即参加事件

join: function (e) {

//向下一个C页面传递的参数

console.log(e,"ljcj");

var id = e.currentTarget.dataset.project_id;

console.log(id,"ljcj_id=project_id");

var clock_title = e.currentTarget.dataset.clock_title;//名字

var comm = e.currentTarget.dataset.comm;//打卡次数

var counts = e.currentTarget.dataset.counts;//参与人数

var clock_img = e.currentTarget.dataset.clock_img;//套餐背景

wx.setStorageSync('clock_img', clock_img)

wx.showModal({

title: '报名须知',

content: '-2018年-09-29-2018-12-28 共计91天r-每天任意时段r-必须发布日记打卡才生效r-以上打卡规则解释权归打卡创建者所有r',

cancelText: "免费参加",

confirmText: "同意参加",

success: function(res) {

if (res.confirm) {

wx.navigateTo({

url: '../pay/pay',

});

} else {

wx.navigateTo({

url: '../free/free?project_id='+ id + '&clock_title=' + clock_title + '&comm=' + comm + '&counts=' + counts });

}

},

})

},

})

free.wxml  

 

view class='tiyan' style="background-image: url('{{clock_img}}'); "

view class='mask'

view class='tiyan1'{{clock_title}}/view

view class='tiyan2'{{counts}}人参加|{{comm}}次打卡/view

/view

/view

free.js

接收B页面传递过来的数据

Page({

/**

* 页面的初始数据

*/

var project_id;

data: {

//顶部套餐信息

clock_title: "",

counts: "",

comm: "",

clock_img: '',

},

onLoad: function(options) {

// 接收上个页面的值 必须在这个方法中 打印一下就有了

// console.log(options, "接收test-1的数据");

var clock_img = wx.getStorageSync('clock_img')

this.setData({

clock_title: options.clock_title,

counts: options.counts,

comm: options.comm,

clock_img: clock_img,

}, () = {

wx.removeStorageSync('clock_img')

// console.log(this.data.clock_title)

})

//获取套餐id

project_id = options.project_id //这个project_id就是上个页面test传来的id

// console.log(project_id, "test-1传递的project_id")

}

})

版权声明

即速应用倡导尊重与保护知识产权。如发现本站文章存在版权问题,烦请提供版权疑问、身份证明、版权证明、联系方式等发邮件至197452366@qq.com ,我们将及时处理。本站文章仅作分享交流用途,作者观点不等同于即速应用观点。用户与作者的任何交易与本站无关,请知悉。

产品经理

手机 : 13312967497

擅长 : 小程序流量变现

扫码领取礼包

最新资讯

热门模板

  • 头条
  • 搜狐
  • 微博
  • 百家
  • 一点资讯
  • 知乎