微信小程序--常用的頁面傳值方式

記錄小程序中常用的幾種頁面傳值方式

一、storage

wx.setStorage({
     key: "key",
     data: value
 })

通過getStorage回調方式獲取data值，或者通過wx.getStorageSync(key) 同步獲取key對應的data值

二、url傳值

url傳值也是經常都能用到的

1、url傳遞通過字符串拼接傳遞key=value形式的參數

wx.navigateTo({
    url: '/pages/index/index?id=1111111111&...',
})

在跳轉后的頁面的onLoad生命周期函數中接受一個options參數，可以通過console.log(options.id)獲取到url傳遞的id值

2、url傳遞對象形式的參數

假設需要傳遞的參數形式為：{key,value,key2:value2}，這時候通過以上方式傳遞在option中打印出來會是一個object類型，([object object]) ,並不能真實獲取參數。因此需要使用JSON.stringify()轉化成json字符串再通過以上方式將參數傳過去。頁面中獲取option的值，需要通過JSON.parse()轉化成原本的json格式。

三、頁面棧傳值

小程序中wx.navigateBack()方法可以返回上級頁面

var pages = getCurrentPages(); // 獲取頁面棧
 var Page = pages[pages.length - 1]; //當前頁
 var prevPage = pages[pages.length - 2]; //上一個頁面

通過prevPage.setData({ key: value})可以改變上一個頁面的data內容，key為上一個頁面data中的值，value為需要傳遞(改變)的值
通過wx.navigateBack({delta: 1}) 返回上級頁面

四、獲取、改變app.js中data的值

app.js中可以保存一個全局的屬性，和storage類似
globalData是一個全局屬性，里面聲明的data值可以在所有頁面中使用。
使用場景，存儲用戶信息、控制頁面刷新

globalData: {
  userInfo: null
}

頁面中的js需要const app = getApp() ，通過app.globalData.userInfo 獲取globalData中userInfo的值，直接賦值即可修改： app.globalData.userInfo= 'haha'