微信小程序 onLoad与onShow之间传值「建议收藏」

微信小程序 onLoad与onShow之间传值「建议收藏」在写一个页面的刷新效果,需求是在页面第一次进来时,做出一次数据加载,之后在页面有个评论操作,每次评论成功都将本页的数据进行刷新。考虑到如果刷新都用onLoad()的话,会造成比较大的资源浪费,所以,把需要进行数据刷新的部分放到onShow页面进行刷新。因为我的函数在加载评论数据的时候,需要一个bookid数值,传参到服务器这样才能获取相对应的数据。但是bookid是从上个页面通过option…

大家好,又见面了,我是你们的朋友全栈君。

在写一个页面的刷新效果, 需求是在页面第一次进来时,做出一次数据加载,之后在页面有个评论操作,每次评论成功都将本页的数据进行刷新。

考虑到如果刷新都用onLoad()的话,会造成比较大的资源浪费,所以,把需要进行数据刷新的部分放到onShow页面进行刷新。
因为我的函数在加载评论数据的时候,需要一个bookid数值,传参到服务器这样才能获取相对应的数据。但是bookid是从上个页面通过options传参过来的,而这个参数到onLoad()为止就结束了,无法再其他的地方使用。但是在页面刚进行加载的时候,data中的数据是没有的,也就是说不能通过onLoad()将 data中的数据进行更新,然后在onShow()中进行调用。
这就造成了本页面中onLoad()与onShow()之间无法进行一个有效时间内的数据交流。
所以我想了个比较偷鸡的方法。
直接上代码:

 onLoad:function(options){
    console.log("onload加载刷新");
    var that = this;
    wx.request({
      url: 'https://www.*******.cn/BookStoreProject/public/store.php/getInformation',
      data: { isUser : 0 , bookid : options.bookid},
      method: 'GET', 
      header: { "content-type": "application/json" },
      success: function (res) {
        console.log(res.data[0]);
        var bookurl1 ='imgUrls['+ 0 +']';
        var bookurl2 = 'imgUrls[' + 1 + ']';
        var bookurl3 = 'imgUrls[' + 2 + ']';
        that.setData({
          bookmsg: res.data[0],
          [bookurl1]: res.data[0].pic1_url,
          [bookurl2]: res.data[0].pic2_url,
          [bookurl3]: res.data[0].pic3_url,
        });
        console.log("获取数据成功")
      },
      fail: function (res) {
        console.log("获取数据失败!");
      },
      complete: function () {
        // complete
      }
    });
    that.onShow(options.bookid);
  }

函数内容可以不必理会,只要看最后一句加了that.onShow(options.bookid);
将onLoad接受到的数据传递到了onShow中。
同样的,onShow函数如下需要接收这个数据:

  onShow: function (bookid){
    var that = this;
    // 获取评论,用来刷新,第一次页面初始加载时无法得到执行结果
    wx.request({
      url: 'https://www.***********.cn/BookStoreProject/public/store.php/showComment',
      data: { isUser: 0, bookid: bookid },
      method: 'GET', 
      header: { "content-type": "application/json" }, 
      success: function (res) {
        const temp = res.data;
        for (var i = 0; i < res.data.length; i++) {
          temp[i].comtime = time.formatTimeTwo(temp[i].comtime, "Y/M/D h:m:s");
        }
        temp.reverse();//评论逆序输出
        that.setData({
          comments: temp,
        });
      }
    }); 
  }

可以看到再request请求中,参数bookid被使用到。
从原理上来讲。页面刚进入的时候,执行onLoad,在onLoad中调用onShow。这个时候页面数据被加载好。然后页面正常调用onShow,此时因为没有参数,所以此次onShow会无法得到有效的结果。我将这次的onShow叫做无效加载。
之后每次需要刷新数据的时候,只需要直接调用onShow就可以了。

我突然发现犯了个傻吊的错误,onShow里面的内容可以直接重新写一个函数封装起来啊,然后直接在onLoad里面调用,之后刷新也直接调用就好了。为什么要多次一举写在onShow里面呢???哭辽。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/149411.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)


相关推荐

  • JAVA实现的小程序[通俗易懂]

    JAVA实现的小程序[通俗易懂]下面介绍一些JAVA实现的一些小程序!!!感兴趣的小伙伴可以点击链接,其中有教程和源码哦!一、JAVA实现雪花飘落首先我们先看效果,雪花是流动的,从上往下,依次变大,十分浪漫!(效果是动态的)二、JAVA实现小球弹跳首先,我们来看效果,一共五个颜色不相同的球,每撞击一下边界,分数加1,分数越大,球的速度越快。(效果是动态的)三、JAVA实现打字小游戏首先我们先看效果,左上角的分数是用来记录我们打对了多少字母。字母是从上面开始往下落。每打对一个字母,分数增加,增加.

  • 汉罗塔问题_6层汉诺塔最少步骤

    汉罗塔问题_6层汉诺塔最少步骤Hanoi汉诺塔是一个发源于印度的益智游戏,也叫河内塔。相传它源于印度神话中的大梵天创造的三个金刚柱,一根柱子上叠着上下从小到大64个黄金圆盘。大梵天命令婆罗门将这些圆盘按从小到大的顺序移动到另一根柱子上,其中大圆盘不能放在小圆盘上面。当这64个圆盘移动完的时候,世界就将毁灭。好吧上面这个东西是我直接百度copy的.这个源自孤古印度的游戏,还是有点意思的,也和递归扯上关系.但是我不明白…

    2022年10月12日
  • SpringCloud系列之服务容错保护Netflix Hystrix

    SpringCloud系列之服务容错保护Netflix Hystrix

    2020年11月19日
  • 手机上安装FTP客户端软件(AndFTP),实现通过手机访问计算机FTP服务器

    手机上安装FTP客户端软件(AndFTP),实现通过手机访问计算机FTP服务器第一步把手机和计算机连接到同一个局域网中(通过WiFi、数据线等)才能进行下面的操作。(本次操作通过wifi连接)第二步:查看手机的IP地址设置—&amp;amp;amp;gt;WLAN—&amp;amp;amp;gt;点击所连的WiFi名,即可查看手机的ip地址。本机IP地址为:172.20.10.12第三步:ping命令测试手机与电脑是否连接打开DOS命令窗口,输入ping172.20.10.1…

  • selenium.webdriver_python electron

    selenium.webdriver_python electronhttp://blog.csdn.net/huilan_same/article/details/52789954今天谈谈文件下载吧,很多人不会处理弹出的文件下载框,其实跟上传类似,可以用autoit和win32api解决,方法类似,可以看博主之前的文章 Pythonselenium——文件上传所有方法整理总结 ,今天这里博主主要想讲讲更漂亮的一种处理办法,那就是指定

  • C# – ref

    C# – ref

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号