我們知道,在微信小程序中,從一個(gè)頁(yè)面轉(zhuǎn)到另一個(gè)頁(yè)面,一般情況下可以通過(guò)navigate或redirect時(shí)候的url來(lái)攜帶參數(shù),然后在目標(biāo)頁(yè)面的onLoad函數(shù)參數(shù)中獲取這些url參數(shù)。例如:
// 源頁(yè)面A相關(guān)代碼
wx.navigateTo({
url: "/pages/mypage/mypage?a=1&b=2"
})
// 目標(biāo)頁(yè)面B相關(guān)代碼
Page({
onLoad: function (options) {
var a = options.a; // 值:1
var b = options.b; // 值:2
}
})
但是,這種方式只有在目標(biāo)頁(yè)面還沒(méi)有創(chuàng)建的時(shí)候,才有效。因?yàn)橐粋€(gè)頁(yè)面的onLoad方法在頁(yè)面的生命周期中,只執(zhí)行一次。
下面主要介紹一下后一個(gè)面向前一個(gè)頁(yè)面?zhèn)髦?/h3>
在【頁(yè)面A】中調(diào)用wx.navigateTo方法跳轉(zhuǎn)到【頁(yè)面B】
然后從【頁(yè)面B】返回【頁(yè)面A】, 并將【頁(yè)面B】中的一些數(shù)據(jù)傳回【頁(yè)面A】
方法1:使用全局?jǐn)?shù)據(jù)存儲(chǔ)
將要傳遞的數(shù)據(jù),存儲(chǔ)在App對(duì)象上(比如globalData屬性)。
將要傳遞的數(shù)據(jù),存儲(chǔ)在小程序的本地?cái)?shù)據(jù)緩存(Storage)中。
例如,我們?cè)趯⒁顺鲰?yè)面B的時(shí)候,作如下調(diào)用:
//=== 1. 存儲(chǔ)到app對(duì)象上的方式 ========
var app = getApp()
app.globalData.mydata = {a:1, b:2}; //存儲(chǔ)數(shù)據(jù)到app對(duì)象上
wx.navigateBack(); //返回上一個(gè)頁(yè)面
//=== 2.存儲(chǔ)到數(shù)據(jù)緩存的方式 =========
wx.setStorage({
key: "mydata",
data: {a:1, b:2},
success: function () {
wx.navigateBack(); //返回上一個(gè)頁(yè)面
}
})
方法2:從頁(yè)面路由棧中直接獲取和操作目標(biāo)Page對(duì)象
這種方式,是通過(guò)調(diào)用小程序的API: getCurrentPages(),來(lái)獲取當(dāng)前頁(yè)面路由棧的信息,這個(gè)路由棧中按照頁(yè)面的路由順序存放著相應(yīng)的Page對(duì)象,我們可以很容易的獲取到上一級(jí)頁(yè)面的完整Page對(duì)象,從而使直接調(diào)用Page對(duì)象的屬性和方法成為可能。
如下所示:
var pages = getCurrentPages();
var currPage = pages[pages.length - 1]; //當(dāng)前頁(yè)面
var prevPage = pages[pages.length - 2]; //上一個(gè)頁(yè)面
//直接調(diào)用上一個(gè)頁(yè)面的setData()方法,把數(shù)據(jù)存到上一個(gè)頁(yè)面中去
prevPage.setData({
mydata: {a:1, b:2}
})