Console.log 在 React.js 的构造函数和渲染函数中打印两次值答案

【问题标题】：Console.log is printing values twice in constructor and render function in React.jsConsole.log 在 React.js 的构造函数和渲染函数中打印两次值
【发布时间】：2020-12-24 06:17:53
【问题描述】：

为什么 console.log 在构造函数和渲染函数中打印两次值？

这里是：

class App extends React.Component {
  constructor(props) {
    console.log('Constructor');
    super(props)

    this.state = {
      counter: 0
    }
  }
render() {
    console.log('render');
    return (
      <div style={{ fontSize: '45px', fontWeight: 'bold' }}>
        Counter: {this.state.counter}
      </div>
    )
  }
}

【问题讨论】：

标签： reactjs constructor react-class-based-component

【解决方案1】：

这是由于React.StrictMode。 React.StrictMode 是一个包装器，可帮助为异步渲染准备应用程序。

您可以在这里阅读更多信息！ https://mariosfakiolas.com/blog/my-react-components-render-twice-and-drive-me-crazy/

【讨论】：