wx:for中的数组使用unshift,自定义组件的lifetimes出现bug
发布于 5 年前 作者 ngong 936 次浏览 来自 官方Issues

自定义组件中:

lifetimes: {
  // 生命周期函数，可以为函数，或一个在methods段中定义的方法名
  attached: function () {
     console.log(this.properties.name)
  },
},

wxml中

<shop-item wx:for="{{arr}}"  wx:key="item" name="{{item.name}}"></shop-item>

js中是数据

arr: [
      {
        id: 1,
        name: 11,
        price: 111,
        num: 1111
      },
      {
        id: 21,
        name: 211,
        price: 2111,
        num: 21111
      },
    ]

页面一开始会log出来 11, 和 211

这个时候

在js里面输入

var l = this.data.arr;
    l.unshift({
      id: 3,
      name: 3,
      price: 33,
      num: 3
    })
    this.setData({
      arr: l
    })

预期结果是log出 一个 3, 但是 它却log出来211, 也就是没有让新加的元素初始化,而是让数组的最后一个又初始化了一遍

2 回复

可以是可以,但是我实际的情况比这个要复杂.

我的结构是这样的.

js数据:

arr: {
      _list: [1, 21],  // 我wx:for 就是循环这个_list, 是number型的数组
      "1": {
        id: 1,
        name: 11,
        price: 111,
        num: 1111
      },
      "21": {
        id: 21,
        name: 211,
        price: 2111,
        num: 21111
      },
    }

xml这样写

<shop-item wx:for="{{arr._list}}"  wx:key="item" name="{{arr[item].name}}"></shop-item>

页面一开始会log出来 11, 和 211

然后执行 一段js代码

var l = this.data.arr;
    l._list.unshift(3)
    var o = {
      id: 3,
      name: 3,
      price: 33,
      num: 3
    };
    l[o.id] = o;
    this.setData({
      arr: l
    })

预期结果是log出 一个 3, 但是 它却log出来211, 也就是没有让新加的元素初始化,而是让数组的最后一个又初始化了一遍

如果重新加载这个页面 是没问题的

wx:key这里换成Id试试

回到顶部