小程序页面跳转传参包含链接地址方案

场景:

平时如果我们在某个页面A传一个带有参数的网络地址(http://www.ca.com?a=45&dd=23)给页面B;如果直接通过字段复制,往往不能直接得到对应http://www.ca.com?a=45&dd=23,微信小程序会自动把该参数拆分成多个参数;

如:

A界面传参

let webUrl ='http://www.ca.com?a=45&dd=23' 
wx.navigateTo({
  url: '../../partials/chating/chating?webUrl=webUrl ,
})

最后B界面得到参数的却是

 #得到的是
{'webUrl':'http://www.ca.com','a':'45','dd':'23'}
#而不是
{'webUrl':'http://www.ca.com?a=45&dd=23'}

解决方案如下:

传参

先把所有的参数放到一个对象里面,然后把对象转换成json字符串,再然后通过encodeURIComponent对json字符串进行编码,最后再把编码后的数据传到下个页面;

let jsonParam = {
      accid: '1051004266212233216',
      nick: '代诗',
      url: "http://www.ca.com?a=45&dd=23"
}
wx.navigateTo({
  url: '../../partials/chating/chating?chatTo=1051004266212233216'+'&jsonParam=' + encodeURIComponent(JSON.stringify(jsonParam)),
})

取参

先取到经过编码传过来的数据,然后对该数据使用decodeURIComponent进行解码,得到解码后的json字符串,最后对解析json字符串就好;

/**
* 生命周期函数--监听页面加载
*/
onLoad: function(options) {
    let jsonParam = JSON.parse(decodeURIComponent(options.jsonParam));
    console.log(jsonParam);
    //{accid: "1051004266212233216", nick: "代诗", url: "http://www.ca.com?a=45&dd=23"}
}
    原文作者:Frankeen
    原文地址: https://blog.csdn.net/kai_1215/article/details/84303270
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞