美文网首页
小程序for循环嵌套请求接口问题

小程序for循环嵌套请求接口问题

作者: 一颗粒普斯 | 来源:发表于2018-07-31 19:31 被阅读355次

    前段时间实现一个小程序滚动加载更多消息的功能(利用scroll-view实现),其中有几个需求需要特殊处理,

    1. 点击列表项可以进入详情;
    2. 点击列表项数据状态改变;
    3. 详情返回列表项位置依旧在离开时的地方

    如果点击时没有数据状态改变那么可以直接使用onLoad方法可以轻松解决,因为要刷新数据,所以只能讲数据请求放在onShow方法中,这样便造成页面返回数据不能停留在离开时的位置
    首先想到的是利用for循环将获取到已经加载的页数,从1递增到离开时的页数

    for(var i=1,i<=pageNum;i++){
        wx.request({
            ...//请求数据与处理
        })
    }
    

    然而微信的请求是异步的,使用var循环后i始终为最后一页.因为小程序支持ES6,直接将var换成let,可是结果和我们预想的不一样,每次获取到数据最少的最先返回,使用数组拼接concat发现顺序总是不可预测(可能和数据查询花费的时间有关)
    其实能用for循环遍历的东西都可以使用递归的方法替代,只是递归的的方法效率会慢一点

    function getItems(){
        wx.request({
            ... //
            success:(res)=>{
                if(num < pageNum) {
                    getItems(++num);
                }
            }
        })
    }
    getItems(1)
    

    这样虽然可以解决数据加载的问题,但是在IOS下还是没法回到离开时的位置,这个时候利用scroll-view组件的scroll-top属性通过bindscroll获取到高度,然后手动设置一下,这样所有的问题就解决了

    相关文章

      网友评论

          本文标题:小程序for循环嵌套请求接口问题

          本文链接:https://www.haomeiwen.com/subject/zbxkvftx.html