小程式三個頁面之間傳參
三個頁面的傳遞引數，這一次我想實現的事我在後臺取到的資料，展現在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\n-每天任意時段\r\n-必須釋出日記打卡才生效\r\n-以上打卡規則解釋權歸打卡建立者所有\r\n',
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")
}
}）