关于react中render执行两次

刚学react，用react-create-app创建项目后发现render中每次都执行两次。即便我没有改动state和props。

render(){
  console.log('xxx',this.state)
  console.log('yyy',this.props)
  return(
    <div>
      <h1>首页</h1>
      <a href="#/profile">到profile页</a>
    </div>
  )
}

componentWillMount(){
  console.log(1)
}

componentDidMount(){
  console.log(2)
}

23936262-f5b6ae74361109fc.png

后来发现是react-create-app默认dev中加了严格模式StrictMode。可见issue

官方文档对严格模式说明见https://react.docschina.org/docs/strict-mode.html