微信小程序中更改数组并重新渲染页面出现的Bug问题,数组setData问题

问题:是出在var array = this.data.array;后更改临时变量中的array的同时(并且没有setData的情况下)会导致this.data.array也发生改变.从而使得我们之后在setData的时候其实并没有发生实际数据的更改(导致没有重新渲染)
解决方案:不要在之前引用this.data.array,而是直接setData中对array中的数值进行更改(改,增删的话可以考虑重新var一个数组进行填充在setData到原来数组中)

这是wxml中关于购物车选中问题的代码,问题出现在点击并触发bindtap且item.selected确实改变了却没有重新进行渲染的问题
注意: 这里重新渲染可能需要在wx:for 之后的 wx:key中有{{index}}这样才能触发绑定有{{index}}语句重新渲染(不确定)

      <icon wx:if="{{item.selected}}" type="success" color="red" data-index="{{index}}" bindtap="selectCard"/>
      <icon wx:else type="circle" data-index="{{index}}" bindtap="selectCard"/>

这是摘抄自的项目代码(购物车部分)

https://juejin.im/post/5912697a128fe10058666179

源码

selectList(e) {
    const index = e.currentTarget.dataset.index;    // 获取data- 传进来的index
    let carts = this.data.carts;                    // 获取购物车列表
    const selected = carts[index].selected;         // 获取当前商品的选中状态
    carts[index].selected = !selected;              // 改变状态
    this.setData({
        carts: carts
    });
}

这是更改之后的js代码

  selectCard: function(e) {
    const index = e.currentTarget.dataset.index;
    let cartList = this.data.cartList;
    var selected = !cartList[index].selected;
    this.setData({
      ['cartList[' + index + '].selected']: selected,
    });
  },