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

前段时间实现一个小程序滚动加载更多消息的功能(利用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获取到高度,然后手动设置一下,这样所有的问题就解决了

你可能感兴趣的:(小程序)