小程序警告：Now you can provide attr `wx:key` for a `wx:for` to improve performance.

文章目录

• 问题
• 解析
• 解决
• 示例

问题

当我们在使用wx:for遍历列表数据的时候，可能会遇到以下警告：

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

解析

字面意思呢，缺少wx:key属性，不过既然是警告，也就表示可有可无，那为什么警告呢？

当我们在使用wx:for遍历列表数据的时候，原则上来讲每条数据都是不一样的，所以需要使用 wx:key来指定列表中项目的唯一的标识符；但是也有可能会出现每条数据就是一样的情况，所以缺少wx:key属性是警告而不是异常报错。

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

解决

添加wx:key属性。wx:key 的值以两种形式提供：

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

示例

  <block wx:for="{{imgUrls}}" wx:key="item.id">
  ...
  </block>

或者

  <block wx:for="{{imgUrls}}" wx:key="*this">
  ...
  </block>

参考： https://developers.weixin.qq.com/miniprogram/dev/reference/wxml/list.html#wx:key