React 踩过的那些坑其中 <React.StrictMode></React.StrictMode> 是启用 Rea

1、StrictMode

在通过 create-react-app 脚手架创建项目后，项目的 index.js 中的代码如下：

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import * as serviceWorker from './serviceWorker';

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

// If you want your app to work offline and load faster, you can change
// unregister() to register() below. Note this comes with some pitfalls.
// Learn more about service workers: https://bit.ly/CRA-PWA
serviceWorker.unregister();

其中 <React.StrictMode></React.StrictMode> 是启用 React严格模式，当我们通过 npm start 运行调试模式后，处于 严格模式 中的组件可能会被构造和渲染2次。这和应用程序的预期有差异。关于严格模式的介绍可查阅官方文档：zh-hans.reactjs.org/docs/strict…