微信小程序setData复杂数组的更新、删除、添加、拼接

发布时间：2020-12-14 19:03:36 所属栏目：资源来源：网络整理

导读：众所周知，微信小程序里所有对数据的修改只有在setData里修改才会在页面上渲染。在此分享小程序里复杂数组的更新、删除、添加、拼接 ? 初始数据数组嵌套对象 data: { cartList = [{ id: 1,goods: {id: 1,name: ' wechat ' },checked: true },{ id: 2,goods:

众所周知，微信小程序里所有对数据的修改只有在setData里修改才会在页面上渲染。在此分享小程序里复杂数组的更新、删除、添加、拼接

初始数据

数组嵌套对象

data: {
    cartList = [{ id: 1,goods: {id: 1,name: 'wechat'},checked: true },{ id: 2,goods: {},checked: false },{ id: 3,checked: true }]
 },

索引部分删除

复制代码

1 let index = 2;
2 let cartList = this.data.cartList
3 cartList.splice(index,1)
4 this.setData({
5         cartList: cartList
6       })

复制代码

内部部分修改

只修改数据内某项里的某属性。但此方法对于有引用到被修改的数据的wxs不会刷新页面显示，尚未清楚是bug还是小程序本身就不支持。

let index = 2
let updateTodo = `cartList[${index}].checked`
this.setData({
          [updateTodo]:  true
        })

用一个变量接收要修改的数组，修改好后再整体setData赋值，如果原数据很大的话可能会影响性能。

1 // push改变原数组 2 let newList= [{ id: 4,checked: true },{ id: 5,255); line-height: 1.5 !important;">false }}] 3 let cartList = 4 cartList.push(...newList); 5 6 cartList: cartList 7 }) 8 9 concat返回添加后的副本，并不会修改原有数组 10 let newList= [{ id: 4,128); line-height: 1.5 !important;">11 let cartList = 12 13 cartList: cartList.concat(newList) 14 })

复制代码

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!