reactjs - React 组件中的构造函数和渲染方法运行两次

Question

我创建了一个 React 项目，并向其中添加了构造函数和渲染方法，在运行它时，我期望构造函数和渲染都只运行一次，但两者都运行了两次。第一个构造函数运行两次然后渲染。有人可以帮忙吗，我的其他生命周期方法也发生了同样的情况。

import React, {Component} from 'react';
class App extends Component {
  constructor(props) {
    super(props)
    console.log('Constructor')
  }

  render() {
    console.log('render')
    return (
      <h1>My Favorite Color is </h1>
    );
  }
}
export default 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')
);

Answer 1

如果我替换下面的代码，它对我有用

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

通过下面的行(但上面的代码是我使用 create-react-app 命令创建项目时作为默认代码获得的代码。

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