打一架,不行就再打一架-----来源:视觉中国
类似这种:
datas:[
{
id:1000,
name: "帅哥",
title: '...',
b: '...',
d: 0,
f:0,
....
},
{
id:1001,
name: "美女",
title: '...',
b: '...',
d: 0,
f:0,
....
},
...
]
其实我只要id和name,找后台解决、、、算了吧,奈何天生就是个儒生,温文尔雅,打架是打不赢的,要是能打赢的就直接打吧,打完让他们改!
数据量过多,对网络请求影响大吗?说实话,不大,又不是几兆的图片,返回数据的速度反正我感受不到延迟。
一般情况下我们是在wxml中循环data,然后取出item.id和item.name,其他数据看起来和我们无关,但是查看官方文档setData相关信息的时候有下面这一段话
setData 是小程序开发中使用最频繁的接口,也是最容易引发性能问题的接口。在介绍常见的错误用法前,先简单介绍一下 setData 背后的工作原理。
小程序的视图层目前使用 WebView 作为渲染载体,而逻辑层是由独立的 JavascriptCore 作为运行环境。在架构上,WebView 和 JavascriptCore 都是独立的模块,并不具备数据直接共享的通道。当前,视图层和逻辑层的数据传输,实际上通过两边提供的 evaluateJavascript 所实现。即用户传输的数据,需要将其转换为字符串形式传递,同时把转换后的数据内容拼接成一份 JS 脚本,再通过执行 JS 脚本的形式传递到两边独立环境。 而 evaluateJavascript 的执行会受很多方面的影响,数据到达视图层并不是实时的。
那么我们能做的就是尽量少传数据,而此时后台返回这一大串数据就与此相悖了,所以最好是新建一个tempData,将要的数据取出来之后再setDta这个tempData,以此来提高微信小程序的页面渲染速度,提升微信小程序运行效率,优化微信小程序的用户体验。
var tempData = []
for(var i = 0; i < datas.length; i++) {
var tempObj = {}
tempObj.id = datas[i].id
tempObj.name = datas[i].name
tempData.push(tempObj)
}
console.log(tempData)
let tempDatas = datas.map(function(data){
return {
id: data.id,
name: data.name
}
})
console.log(tempDatas)
以上就是微信小程序开发中关于后台返回大量冗余数据的处理方案啦,在一定程度上是能提升微信小程序的运行效率的,当然最最最直接的方法就是和后台打一架,谁输了谁去优化代码!!!!
obj:{a:"a",b:"b",c:"c"},
此时已经渲染到页面了,然后我们修改了obj,此时可以选择:
let obj = this.data.obj
obj.b = "我是后来修改的"
this.setData({
obj: obj
})
this.setData({
'obj.b': "我是后来修改的"
})
不仅省了两行代码,同时还提高页面渲染效率
当我们要给数组的其中一个数据进行修改时,我们可以参照上面的方法
this.setData({
'array[1]': "我是后来修改的"
})
当我们要给数组的多个数据进行修改时,我们会写一个循环,然后修改array[i],此时是无法识别的,要写成如下形式
for(var i = 0;i < 5;i++) {
this.setData({
[`array[${i}]`]:"我是后来修改的"
})
}
小伙伴们还有其他有关微信小程序setData的其他知识点,欢迎留言哦,同时知道为上面那个为啥要加 []
的,希望多多指教!