JSON.parse()出错解决

在做微信小程序时遇到的问题，记录一下。

需求：

将购物车页面的商品信息通过url传到确认订单页
复制代码

购物车页面处理过程：

在购物车页面，处理商品信息组装成如下形式：
goodsInfoArr = [{"GoodsId":"12","GoodsImg":"http://a.example.com/xx/?sss/fgfg","GoodsTitle":"这里是title"}]
GoodsImg的url是后端传过来的商品图片的url形式
然后,将这个商品信息的数组通过JSON.stringify()转化成字符串，放在页面的url中传过去
goodsInfoStr = JSON.stringify(goodsInfoArr);
wx.navigateTo({
  url: 'test?goodsInfo=goodsInfoStr'
})
复制代码

确认订单页面处理过程：

在确认订单页面拿到url上的goosInfoStr之后，我们开始用JSON.parse(goosInfoStr)来解析这个数据
复制代码

此时，问题来了，页面报错了,原因是 img的地址里面 ?被截断了

解决方法

只要在购物车页面用encodeURIComponent()对goodsImg的url进行编码，然后在确认订单页利用decodeURIComponent()对url进行解码就可以了
goodsInfoArr = [{
    "GoodsId":"12",
    "GoodsImg":encodeURIComponent("http://a.example.com/xx/?sss/fgfg"),
    "GoodsTitle":"这里是title"
}]

JSON.parse(goodsInfoArr)
 然后用的时候就 decodeURIComponent(goodsInfoArr.GoodsImg)就可以了
复制代码