公众号留言小程序「柒留言」已更新至 v2.1.0 版本,欢迎入驻使用!

小程序九九八十一坑之跳转传参

Share 玖柒 264℃ 0评论

垂死病中惊坐起,笑问 Bug 何处来?!

1、先是大写字母作祟

前两天发布了「柒留言」v2.0.0 新版本,结果...你懂的嘛,没有 Bug 的程序不是好程序,写不出 Bug 的程序员不是好程序员。

那个,有一两个小 Bug 很正常的啦。

有用户反馈,收到了留言回复的通知,但是点进去没有内容。怎么会有 Bug 呢?肯定是你用的方法不对。

​下班回到家的我立马打开开发者工具,一测试发现,果然,我是不可能写不出 Bug 的。

写 Bug 是一把好手,找 Bug 我也是不赖的,最后原因定位:参数没有正确传递。

  1. A 页面  
  2. // a.wxml  
  3. <view data-testID="test" data-openid="msunh" bindtap="toB">B</view>  
  4.   
  5. // a.js  
  6. toB(e) {  
  7.   var i = e.currentTarget.dataset;  
  8.   wx.navigateTo({  
  9.     url: '/pages/b?testID=' + i.testID + '&openid=' + i.openid,  
  10.   })  
  11.   console.log(i)  
  12. }  
  13. B 页面  
  14. // b.js  
  15. onLoad: function (options) {  
  16.   this.setData({  
  17.     testID: options.testID,  
  18.     openid: options.openid  
  19.   })  
  20. }  

结果是:

​很明显,openid 获得了正确参数,说明接收和传递过程毛问题,那就是传递之前 testID 就出错了。

控制台打印一下 dataset,发现没有, testID 变成了 testid。

​这说明了什么?说明他在搞事情,他在搞我!这里把 testID 改成 testid,就能正确传递了。

​数据绑定不能用大写,记住啊,兄die。(或者可以用大写绑定,小写获取,开心就好呀)

2、连一个 ? 都敢搞我?

改完 Bug 想着可以休息会,结果大半夜又有人找:回复读者失败了。

我试了一下,没发现他说的问题。便回复道:刷新一下?多试两次?换个网络?应该不是我这边的问题吧...

过了一会,这个老哥说还是不行,然后这个老哥大半夜还和我一起来找 Bug 了,感动,找到 Bug 我还特地发了个红包感谢。

最后发现数据在一个问号那里断开了,前面数据正常,后面数据被截断。仔细看下是因为用户输入了一个英文「?」??????

​做个测试:

  1. A 页面  
  2. // a.wxml  
  3. <view data-hello="你最近怎么样?我很好" bindtap="toB">toB</view>  
  4. // a.js  
  5. toB(e) {  
  6.   var i = e.currentTarget.dataset;  
  7.   wx.navigateTo({  
  8.     url: '/pages/b?hello=' + i.hello,  
  9.   })  
  10. }  
  11. B 页面  
  12. // b.js  
  13. onLoad: function (options) {  
  14.   this.setData({  
  15.     hello: options.hello,  
  16.   })  
  17. }  

结果 AppData 中是这样的:

果然是英文问号惹的麻烦,脑壳疼,连个「?」都来找麻烦,我好南南南南南南啊。

3、盘他

找到问题了就盘他,但这不能怪用户,鬼知道什么时候就输入了一个「?」。因为跳转路径中加参数也是用的「?」,所以这里应该是被误「?」后面带参。

最后我想了两种方法,这里供大家参考一下,如果有更好的方法,欢迎留言一起讨论。

I. 跳转页面的时候把 dataset 的数据写入缓存,到了新页面再读取缓存,这里就不啰嗦了,关键是第二种。

II. 利用 replace 把 ? 转化成 ?

但是这里有个问题,用  replace('?', '?') 的话,只能转化一次。

如果输入了多个英文问号呢?不排除这种可能,所以不建议用  replace('?', '?') ,推荐加入正则表达式,即 replace(/\?/g, "?") 去转化英文问号。

4、最后

柒块腹肌的玖柒回来了,有段时间没更新了,一直在忙着重写小程序,主要是我还没有想到更好的借口。

​今年还有 101 天,我会努力爬上来更新的,点击下方「写留言」一起讨论呀,分享、讨论才是更好的学习方式,摇起来。

转载请注明:我是玖柒后 » 小程序九九八十一坑之跳转传参

喜欢 (0)
发表我的评论
取消评论
表情

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址