1. 程式人生 > >微信小程式-返回並更新上一頁面的資料

微信小程式-返回並更新上一頁面的資料

小程式開發過程中經常有這種需求,需要把當前頁面資料傳遞給上一個頁面,但是wx.navigateBack()無法傳遞資料。

一般的辦法是把當前頁面資料放入本地快取,上一個頁面再從快取中取出。

除此之外還有一種辦法,巧妙利用頁面棧。

getCurrentPages() 函式用於獲取當前頁面棧的例項,以陣列形式按棧的順序給出,第一個元素為首頁,最後一個元素為當前頁面。

重點就在這裡,在當前頁面拿到上一個頁面的例項物件,然後呼叫該物件的方法完成資料傳遞。

頁面A

Page({
     data: {
        name: ''
     },
     ...
     ,
     //更新name
     changeData
: function(name){ this.setData({ name: name }) } })

頁面B,假設有一個文字框用於輸入姓名,點選返回按鈕後更新頁面A的name

Page({
    //此方法用於文字框輸入回撥
    inputTyping: function (e) {
        //獲取頁面棧
        var pages = getCurrentPages();
        if(pages.length > 1){
            //上一個頁面例項物件
            var prePage =
pages[pages.length - 2]; //關鍵在這裡 prePage.changeData(e.detail.value) } } })

這樣就可以實現資料傳遞給上一個頁面,要注意頁面A必須使用wx.navigateTo跳轉到頁面B,不能使用wx.redirectTo,這樣會關閉上一個頁面,導致頁面B無法獲取上一頁Page例項。