# 警告：组件在开发环境中渲染两次。useEffect 清理在挂载后立即运行。API 在组件挂载时被调用两次。

- **ID:** `react/strict-mode-double-invoke-effect`
- **领域:** react
- **类别:** runtime_error
- **验证级别:** ai_generated
- **修复率:** 75%

## 根因

开发环境中的 React StrictMode 会故意双重调用副作用以检测副作用错误，导致清理在挂载后立即运行，并且副作用触发两次。

## 版本兼容性

| 版本 | 状态 | 引入 | 弃用 |
|------|------|------|------|
| react@18.2.0 | active | — | — |
| react@17.0.2 | active | — | — |

## 解决方案

1. ```
   Ensure useEffect has a proper cleanup function that cancels the API call or subscription. This makes the double invocation harmless.
   ```
2. ```
   Use useRef to track if the effect has already run and skip the second invocation if needed (only for specific cases like analytics).
   ```

## 无效尝试

- **Removing StrictMode wrapper entirely to stop double invocations** — StrictMode is a development tool; removing it hides the bug but doesn't fix it. The same bug may cause issues in production if effects have improper cleanup. (60% 失败率)
- **Adding a flag to prevent the second API call (e.g., if (called) return)** — This masks the StrictMode behavior but may break cleanup logic or cause stale data if the flag is not reset properly. (75% 失败率)
- **Ignoring the double call as a development-only issue** — If the effect has side effects like subscriptions or analytics, the double call can cause production-like bugs that are hard to debug. (50% 失败率)