Most of the friends who are developing WeChat Mini Programs must have encountered such a warning:
wx:key explained:
If the position of the item in the list will change dynamically or a new item is added to the list, and you want the item in the list to maintain its own characteristics and status, then you need wx:key to specify the unique identifier of the item in the list;
There are two ways to get values:
- wx:key="prooperty" , the property represents a property of the item in the array of the for loop. The value of the property needs to be the only string or number in the list and cannot be changed dynamically. Similar to the key value of a dictionary; ps: It is recommended to add a uniquely identified property for each item to manage.
- wx:key="*this", the reserved keyword *this represents the item itself in the for loop, indicating that the item itself needs to be a unique string or number, such as:
- When a data change triggers a render layer re-render, components with keys will be corrected, and the framework will ensure that they are reordered rather than recreated, to ensure that components maintain their own state and improve the efficiency of list rendering.
ps: If you know that the list is static, or don't care about its order, you can choose to ignore it.