由于严格模式，我的 React 组件渲染了两次

Question

我的 React 组件渲染了两次。所以，我决定逐行调试，问题就在这里

  if ( workInProgress.mode & StrictMode) {
        instance.render();
      }

反应-dom.development.js

是因为严格模式吗？我可以禁用它吗？什么是严格模式？我需要吗？

原文由 Marry Joanna 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

StrictMode 渲染组件两次（在开发中而不是在生产中）以检测代码中的任何问题并警告您（这可能非常有用）。

如果您在您的应用程序中启用了 StrictMode 但不记得启用它，可能是因为您最初使用 create-react-app 或类似工具来创建您的应用程序，默认情况下会自动启用 StrictMode。

例如，您可能会发现您的 {app} 在您的 index.js 中被 <React.StrictMode> 包装：

   ReactDOM.render(
     <React.StrictMode>
       {app}
     </React.StrictMode>,
    document.getElementById('root')
  );

如果是这样，您可以通过删除 <React.StrictMode> 标签来禁用 StrictMode：

   ReactDOM.render(
    {app}
    document.getElementById('root')
  );

原文由 rangfu 发布，翻译遵循 CC BY-SA 4.0 许可协议