wepy [框架设计bug]同一页面互相跳转后回退,页面数据错乱

e5nqia27  于 9个月前  发布在  其他
关注(0)|答案(4)|浏览(137)

Description

  • 需求的场景描述:(希望解决的问题)

必现步骤:

在List中点

  1. 击进入某一个商品详情A;
  2. 然后在详情A的页面中又会有别的推荐商品;
  3. 这时候点击进入商品详情B;
  4. 页面展示的是商品B的data数据;
  5. 关键的操作来了;这个时候返回商品A(不区分右滑返回和左上角返回键和物理返回键);
  6. 会发现商品详情A页的data数据仍然是商品详情B的data数据,但页面不刷新的情况显示的是A的详情,一刷新就显示B的详情~

简单总结:

  1. 比如商品详情A跳商品详情B,页面路径都是'pages/detail/index',只是页面里渲染的data不一样,回退后最新的页面数据会覆盖旧的页面数据,怀疑是页面 A、与页面 B 共享同一个 Page 实例导致的。

Environment

  • Platform: 开发者工具+iOS+Andriod
  • Platform version: all
  • Wechat version: all
  • wepy-cli version: 最新版
  • wepy version: 1.7.2(2018-05-08)

Reproduce

[如何重现问题]

https://developers.weixin.qq.com/s/NIGWZumJ796Z
写了个比较简单的demo,在原生小程序表现符合预期,但是在wepy框架中,就会复现我上面中描述的bug

[期望表现]

页面回退数据还能回到原页面的数据,不希望单页面单实例

Relevant Code / Logs

  1. <style lang="less">
  2. .introTip{
  3. color:grey;
  4. font-size:30rpx;
  5. margin-top:100rpx;
  6. }
  7. .intro{
  8. text-align: center;
  9. }
  10. button{
  11. width: 80%;
  12. margin: 30rpx auto;
  13. }
  14. </style>
  15. <template>
  16. <view>
  17. <view class="intro">当前数字:</view>
  18. <view class="intro">{{number}}</view>
  19. <button bindtap="plus">下一页</button>
  20. <button bindtap="show">显示当前数字</button>
  21. <view class="introTip">
  22. <view>步骤:</view>
  23. <view>先点击"下一页"</view>
  24. <view>再右上角返回</view>
  25. <view>点击"打印当前数字"</view>
  26. <view>页面显示1, 但console.log()打印出来的是2</view>
  27. <view>即:同页跳转,栈顶页面的数据覆盖之前页面的数据</view>
  28. </view>
  29. </view>
  30. </template>
  31. <script>
  32. import wepy from 'wepy'
  33. export default class Index extends wepy.page {
  34. config = {
  35. navigationBarTitleText: 'Test'
  36. }
  37. components = {}
  38. data = {
  39. number: 1
  40. }
  41. methods = {
  42. plus() {
  43. wx.navigateTo({
  44. url: `/pages/index?number=${+this.number + 1}`
  45. })
  46. },
  47. show() {
  48. console.log(this.number)
  49. }
  50. }
  51. onLoad(option) {
  52. const { number = '' } = option
  53. if (number) {
  54. this.number = number
  55. }
  56. }
  57. }
  58. </script>
  59.  ```
  60. [](url)
uqdfh47h

uqdfh47h1#

结合&&判断,使用this.$wxpage.data获取对应的数据,前提是所有数据必须现在data里面写好,不然页面实例不会记录当前的key,会报错的

des4xlb0

des4xlb02#

这个我也遇到了,差不多是利用楼上的方法
可以利用__wxWebviewId__这个属性区别不同实例页面

h9a6wy2h

h9a6wy2h3#

这个我也遇到了,差不多是利用楼上的方法
可以利用__wxWebviewId__这个属性区别不同实例页面

老哥厉害了,又学到新的属性

30byixjq

30byixjq4#

这个我也遇到了,差不多是利用楼上的方法
可以利用__wxWebviewId__这个属性区别不同实例页面

碰到相同的问题了,从 第一页 跳转到 第二页 再返回,在onShow 中 输出 wxWebviewId,输出的是第二页的而不是第一页的,这个时候在第一页 拿到的 this.$wxpage.data 也是 第二页的,这个要怎么处理?难道要把数据在跳转之前都缓存起来,返回时再重新初始化吗?

相关问题