微信小程序 - 參數傳遞

小程序傳遞參數的方式有三種：

（1）經過在App.js中設置全局變量

（2）經過拼接URL直接傳遞

（3）經過數據緩存存儲再獲取

1.app.js

一般把不會更改的數據放在app.js的Data中，在各個頁面中均可以經過APP實例獲取Data數據。

var app = getApp();
var data = app.data;

2.wx.navigateTo({})中URL攜帶參數

wx.navigateTo({
  url: 'test?id=1'
});

3. 數據緩存

①wx.setStorageSync(KEY,DATA)存儲數據

try {
  wx.setStorageSync('key', 'value')
} catch (e) {    
}

②wx.getStorageSync(KEY)獲取數據

try {
  var value = wx.getStorageSync('key')
  if (value) {
    // Do something with return value
  }
} catch (e) {
   // Do something when catch error
}
或
wx.getStorage({
  key: 'key',
  success: function(res) {
     console.log(res.data)
  }
})

然而，根據所傳遞參數的數據類型的不一樣，如對象、數組集合須要進行相應的處理。本質上都是String類型的傳遞。

 

一、傳遞基本數據類型

Page({  
  data: {
    testStr: 'xiaochengxu'
  },
  next: function(e){
    wx.navigateTo({
      url: '/test/test?str='+this.data.testStr
    })
  }
})

Page({
  onLoad:function(options){  
    console.log("接收到的參數是str="+options.str);  
  }
})

打印內容：接收到的參數是str=xiaochengxu

 

2，傳遞對象

Page({
  data: {
    testData:{name:'username', password:'password'}  
  },
  next: function(e){
    wx.navigateTo({
       url: '/test/test?testData='+JSON.stringify(this.data.testData)
    })
  }
})

Page({
  data:{
    testData:null
  },
onLoad:function(options){
   console.log("接收到的參數是testData="+options.testData);
   this.data.testData = JSON.parse(options.testData);
}}) 

打印內容：

接收到的參數是testData={"name":"username","password":"password"}

 

3，傳遞數組集合

Page({
  data: {
    list:['item-A','item-B']
  },
  next: function(e){
    wx.navigateTo({
      url: '/test/test?list='+JSON.stringify(this.data.list),
    })
  }
})

Page({  
  data:{
    list:[]
  },
onLoad:function(options){
   console.log("接收到的參數是list="+options.list); 
   this.data.list = JSON.parse(options.list);  
}})

打印內容：接收到的參數是list=["item-A","item-B"]

統一處理：

var dealParam = function(data) {
  for(var i in data) {
    if (typeof data[i] == ‘string’){
      console.log(「key=」+i+「; value=」+data[i]);
    } else if (typeof data[i] == ‘object’) {
      dealParam(data[i]);
    }
  }
}

但願對你們有所幫助！ 或許小小贊助!