最新react-crate-app 新项目会建立 React.StrictMode带来的问题
今天新起了一个react项目,发现如下问题
- 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')
);
- app.js
import React from 'react';
function Demo(props){
console.log('demo')
return (
<div>
</div>
)
}
class ChildrenDemo extends React.Component {
constructor(props){
super(props)
this.state = {}
console.log('hello')
}
render(){
return (
<div>
ChildrenDemo
</div>
)
}
}
function App() {
console.log('app--------');
return (
<div className="App">
<ChildrenDemo></ChildrenDemo>
<Demo></Demo>
</div>
);
}
export default App;
问题:
控制台居然函数组件 Demo只会输出一次demo
, 但是类组件却打印了两次hello
,当注释掉 index.js
中的<React.StrictMode>
就好了,请问这是啥意思?
结果查询了文档居然是:
