# 警告：列表中的每个子元素都应该有一个唯一的'key'属性。

- **ID:** `react/missing-key-props`
- **领域:** react
- **类别:** runtime_error
- **验证级别:** ai_generated
- **修复率:** 95%

## 根因

渲染数组中的组件或元素时没有为每个项目指定唯一的 'key' 属性，这会影响 React 的协调过程并可能导致渲染错误。

## 版本兼容性

| 版本 | 状态 | 引入 | 弃用 |
|------|------|------|------|
| React 16.0.0 | active | — | — |
| React 17.0.2 | active | — | — |
| React 18.2.0 | active | — | — |

## 解决方案

1. ```
   Provide a stable, unique identifier from your data as the key, e.g., `data.map(item => <Component key={item.id} />)`. If no ID exists, generate a unique key using a library like `uuid`.
   ```
2. ```
   If the list is static and never reordered, use the index as a last resort with a comment documenting the limitation: `data.map((item, index) => <Component key={index} />)`
   ```

## 无效尝试

- **** — Index-based keys are unstable if the list can be reordered, filtered, or have items added/removed, leading to incorrect component state and performance issues. (70% 失败率)
- **** — Random keys cause React to unmount and remount all components on every render, destroying state and causing severe performance degradation. (95% 失败率)
- **** — Duplicate keys violate the uniqueness requirement and cause React to reuse components incorrectly, leading to unpredictable UI behavior. (90% 失败率)