Now you can provide attr "wx:key" for a "wx:for" to improve performance-蒲公英云

Now you can provide attr "wx:key" for a "wx:for" to improve performance

小程序开发中遍历列表时，出现警告Now you can provide attr "wx:key" for a "wx:for" to improve performance 这是因为没有添加属性，使用 wx:key 来指定列表中项目的唯一的标识符。

wx:key 的值以两种形式提供

字符串，代表在 for 循环的 array 中 item 的某个 property，该 property 的值需要是列表中唯一的字符串或数字，
且不能动态改变。
保留关键字 *this 代表在 for 循环中的 item 本身，这种表示需要 item 本身是一个唯一的字符串或者数字，如：
当数据改变触发渲染层重新渲染的时候，会校正带有 key的组件，框架会确保他们被重新排序，而不是重新创建，以确保使组件保持自身的状态，并且提高列表渲染时的效率。

如不提供 wx:key，会报一个 warning，如果明确知道该列表是静态，或者不必关注其顺序，可以选择忽略。

wxml示例：

<radio-group class="radio-group" bindchange="radioChange"> <!--wx:for="{ { descary}}" 指定要遍历列表或数组的名称；wx:for-item="row" 指定遍历列表或数组的item， 保留关键字item（如果不指定默认用item），可以自己指定item名称；wx:key="name" 指定每个item的唯一标识--> <label class="radio" wx:for="{ { descary}}" wx:for-item="row" wx:key="name" style='display:block;margin-top:10rpx;margin-bottom:10rpx;'> <radio value="{ { row.name}}" checked="{ { row.checked}}"/>{ { row.taketype}} <text class='textcomm'>{ { row.desc}}</text> { { row.feedec}}</text> </label> </radio-group>

js示例：

Page({ data: { descary: [ { name: '1', taketype: '苹果', desc: '(甜甜的)', feedec: '一元一个', fee: '', checked: true },
      { name: '2', taketype: '柠檬', desc: '(酸酸的)', feedec: '1毛一个', fee: '', checked: false },
    ],
  },
  onLoad:function(){ },
  onReady: function () { },
})