无意中发现react渲染执行两次,开始以为是代码写错了,后来去网上查找发现原来并不是一个bug。
React 在 开发环境下会刻意执行两次渲染,以防止组件内有什么 side effect 引起 bug,提前预防。
这里官方github上有作出解释:
从代码中来看
let a = 0class App extends React.Component { render() { a = a + 1 console.log(`运行${a}次`) return ( <div></div> ) }}
控制台显示结果运行了两次。