JSON

说说微信小程序开发的那些坑

字号+ 作者:H5之家 来源:H5之家 2017-12-11 09:16 我要评论( )

this.setData估计是小程序中最经常用到的一个方法,但是要注意其实他是有限制的,忽略这些限制的话,会导致数据无法更新setData的反模式:-- 短时间频繁进行setD

this.setData估计是小程序中最经常用到的一个方法,但是要注意其实他是有限制的,忽略这些限制的话,会导致数据无法更新

setData的反模式:
-- 短时间频繁进行setData操作
--页面进入后台后依然进行setData操作
-- 使用setData一次性设置太多的数据

这里重点说一下第3点,获取更新列表的时候非常容易触犯第三点,举个栗子:
假设Page中data有items的数据,装着列表的数据

Page({ data: { items: [], } });

一般情况下,更新items的操作可能如下:

loadItems() { //假设通过API获取到新的列表数据:newItems const { items } = this.data; this.setData({ items: items.concat(newItems) }) }

如果完整items的数据量不大的时候,这样做也是可以的,但是列表的数据比较多的时候,后面loadItems时setData的数据就会变很大,超过一定值(1048576)后就会报以下错误,然后列表无法再加载更多

数据传输长度为 xxxxxx 已经超过最大长度 1048576

若遇到这样的情况,我的解决方法是

loadItems() { //依然假设通过API获取到新的列表数据:newItems const { items } = this.data; const start = items.length; const updateItems = newItems.reduce((updateItems, item, index) => { const key = `items[${start + index}]`; updateItems[key] = item; return updateItems; }, {}) //updateItems 示例: { items[0]: 'content', item[1]: 'content', ... } this.setData(updateItems) }

以上是我开发时遇到的坑,欢迎大家探讨指导,感谢阅读

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
网友点评