小程序 wx.navigateTo传值总结

wx.navigateTo(Object object)

保留当前页面,跳转到应用内的某个页面。但是不能跳到 tabbar 页面。使用 wx.navigateBack 可以返回到原页面。小程序中页面栈最多十层。

     具体参数参见微信公众平台 | 小程序 API

其中url参数是需要跳转到目标页面的路径,路径可以带参数,现在我们就看看这个参数怎么传递

1. 传参格式:参数与路径之间使用 ?分隔,参数键与参数值用 = 相连,不同参数用 & 分隔;如 '/pages/index/index?value1=hello&value2=world'

2. 不同类型的参数传递:

Tip:其中下面的index是传值页面,text为接收参数页面

传递字符串

// index.js
onClick: function (e) { var str = 'Hello World' wx.navigateTo({ url: '../test/test?str=' + str, success: function(res) {}, fail: function(res) {}, complete: function(res) {}, }) }

// test.js
onLoad: function(options) { var str = options.str this.setData({ str: str }) }

传递对象/数组:需要通过JSON.stringify将对象转换为字符串传递,接收时需要通过JSON.parse将字符串转换为对象

// index.js
onClick: function (e) {
    var obj = JSON.stringify(myObj) //myObj:本js文件中的对象
    wx.navigateTo({
      url: '../test/test?obj=' + obj,
      success: function(res) {},
      fail: function(res) {},
      complete: function(res) {},
    })
  }
// test.js
onLoad: function(options) {
    var obj =JSON.parse(options.obj)
//  testObj:本js文件中的对象
    this.setData({
      testObj: obj
    })
  }

注意:如果对象的参数或数组的元素中遇到地址,地址中包括?、&这些特殊符号时,对象/数组先要通过encodeURIComponent编码再通过JSON.stringify转化为字符串,接收时,先通过decodeURIComponent解码再通过JSON.parse转换为JSON格式的对象/数组,具体参考:小程序页面跳转传参包含链接地址方案

 

猜你喜欢

转载自www.cnblogs.com/china-fanny/p/10455233.html