自定义组件中:
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, 也就是没有让新加的元素初始化,而是让数组的最后一个又初始化了一遍
可以是可以,但是我实际的情况比这个要复杂.
我的结构是这样的.
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-itemwx:for="{{arr._list}}"wx:key="item"name="{{arr[item].name}}"></shop-item>页面一开始会log出来 11, 和 211
然后执行 一段js代码
varl =this.data.arr;l._list.unshift(3)varo = {id: 3,name: 3,price: 33,num: 3};l[o.id] = o;this.setData({arr: l})预期结果是log出 一个 3, 但是 它却log出来211, 也就是没有让新加的元素初始化,而是让数组的最后一个又初始化了一遍
如果重新加载这个页面 是没问题的
wx:key这里换成Id试试
你既然知道push和unshift区别，就应该知道为什么会出现这个问题了
l._list.unshift(3) => [3,1,21]
l[o.id] = o; => {"1":{...}, "21":{...}, "3":{...}}
以_list来循环，你用unshift之后，相对于原来wxml的for而言，新加的shop-item节点是谁？是item=2的，_list[2] = 21, 21 对应 的是？