微信无响应,解决微信小程序数据渲染缓慢或卡顿的方法-即速应用

微信无响应,解决微信小程序数据渲染缓慢或卡顿的方法

浏览量：3181 时间：2019-12-09 来源：四夕木木夕木木

在微信小程序中渲染数据时通常会使用setData方法，但是setData对数据是有影响的，单次设置的数据不能超过1024kB，否则就会出现卡顿甚至有时会导致小程序闪退等现象，而我们在实现上拉加载分页数据，或下滑加载更多分页数据时，通常会出现卡顿的问题，为了解决这个问题，我的方法是把从接口获取到的数据一维数组转换为二位数组，代码如下：
initData(){wx.request({url:'',//这里填写你的接口路径header:{//这里写你借口返回的数据是什么类型，这里就体现了微信小程序的强大，直接给你解析数据，再也不用去寻找各种方法去解析json，xml等数据了'Content-Type':'application/json'},data:{//这里写你要请求的参数x:'',y:''},success:(res)={//这里就是请求成功后，进行一些函数操作console.log(res.data)vara=res.data.listData;var_listData=Object.values(a.reduce((re,item)={re[item.receiveTime]?re[item.receiveTime].push(item):re[item.receiveTime]=[item];returnre;},{}));this.setData({listData:_listData})}})},onLoad(){this.initData()}一般从接口拿到的数据是一个一维数组[{…},{…},{…},{…},{…},{…},{…},{…},{…},{…},{…},{…}]，通过上述方法就变成了二维数组[Array(12)]，然后，把每次触顶或触底所得的数据使用concat拼接起来就变成了[Array(15),Array(12),Array(13),Array(12)]这样形式，最后渲染的时候使用双重循环来，如下：
blockwx:for="listData"wx:key="in{{index}}"viewwx:for="item"wx:key="en{{index}}"view{{item.content}}/view/view/block好啦，今天就说到这，下次继续。。。。。。

即速应用倡导尊重与保护知识产权。如发现本站文章存在版权问题，烦请提供版权疑问、身份证明、版权证明、联系方式等发邮件至197452366@qq.com ，我们将及时处理。本站文章仅作分享交流用途，作者观点不等同于即速应用观点。用户与作者的任何交易与本站无关，请知悉。