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

场景:

平时如果我们在某个页面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"}
}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值