当前位置: 首页 > Web前端 > HTML5

解决安全生产知识题库小程序加载超大数据无法渲染的问题

时间:2023-04-05 21:34:22 HTML5

解决安全生产知识问答题库小程序加载大数据setData导致无法渲染的问题,其实两者都是一次性setData,会导致加载时出现空白无法渲染的问题加载大数据。安全生产知识问答解决微信小程序加载大数据时无法渲染空白的问题更改对应this.data的值(同步)。一次设置的数据不能超过1024kB,请尽量避免一次设置过多的数据。文档上写的是单机设置,但是在使用过程中发现批量设置到了这个值还是无法渲染数据。这时候的解决办法一般是只显示可以渲染的item数量,或者翻页。你不能无限加载更多。从这点来看,还是不理想。找了半天,找不到答案。在此与大家分享一下解决方法。废话不多说,答案是官方提供了一个加载更大数据的容器来解决这个问题,recycle-view,大家熟悉吗?Android中也有这个组件,RecycleView。怎么用我就不多说了。我直接附上官方文档。让我们优化它。微信小程序setData数据量过大问题的解决及页面刷新加载的实现在微信小程序中,我们经常会使用setData方法来修改数据,从而达到更新页面的目的。但是当我们通过setData方法设置的数据过大时,就会报如下错误。vdSyncBatch数据传输长度为2260792,已经超过最大长度1048576,这是因为setData设置的数据量有限,单次设置的数据大小不能超过1024kb,否则会出现上述错误。(微信小程序官方文档解释了setDate的限制)而在一些列表页中,每次上拉加载更多后,我们会习惯性的将之前存在的数据和新加载的数据进行合并,通过setData一起提交,重新加载渲染页面。但是这样一来,当用户浏览的数据量达到一定程度时,就会出现上面的错误。解决方案:从第一个红框可以看出,setData可以批量修改同一个数据中的对象,而不是重新覆盖某个数据中的对象。问题代码:data:{list:[]},getData:function(){letarr=[];...//将本次加载的数据赋值给arrsetData({list:this.data.list.concat(arr)});}解决方法:通过设置数组下标(二维数组),只加载新加载的setDate每次都可以实现数据。data:{pageNo:0,list:[]},getListData:function(){letarr=[];......//将本次加载的数据赋值给arrsetData({['list['+pageNo+']']:arr});ele.xxxele.xxx