本意是测试一下父子组件生命周期执行顺序，发现组件的 constructor 以及render 都执行了2次，截图如下：
原因我是用crear-react-app 脚手架搭建的项目，默认是 StrictMode
StrictMode 会默认执行两次rende，来检测render函数有没有副作用
注意： StrictMode 只在开发模式生效。生产模式下生命周期不会被双调用
关于StrictMode 以下为官方文档
StrictMode is a tool for highlighting potential problems in an application.
Like Fragment, StrictMode does not render any visible UI.
It activates additional checks and warnings for its descendants.
StrictMode 是一个用以标记出应用中潜在问题的工具。就像 Fragment ，StrictMode 不会渲染任何真实的UI。它为其后代元素触发额外的检查和警告。
理论上，React在两个阶段起作用：
渲染 阶段决定了需要对 DOM 进行哪些更改。在此阶段, React调用render(方法), 然后将结果与上一次渲染进行比较。
提交 阶段是React执行任何更改的阶段。(在React DOM中, 指React插入、更新和删除 dom 节点）。在此阶段React也调用生命周期, 如 componentDidMount 和 componentDidUpdate 。
提交阶段通常很快，但是渲染可能很慢。因此, 即将出现的异步模式 (默认情况下尚未启用) 将呈现工作分解为片断, 暂停和恢复工作以避免阻止浏览器。这意味着在提交之前, 反应可能不止一次地调用渲染阶段生命周期, 或者它可以在不提交的情况下调用它们 (因为错误或更高的优先级中断)。
渲染阶段的生命周期包括以下class component方法：
constructor
componentWillMount
componentWillReceiveProps
componentWillUpdate
getDerivedStateFromProps
shouldComponentUpdate
render
setState 更新函数 (第一个形参）
因为以上方法可能不止一次被调用，所以它们中不包含副作用尤为重要。忽略此规则可能会导致各种问题, 包括内存泄漏和无效的应用程序状态。不幸的是, 很难发现这些问题, 因为它们通常都是不确定的。
