Why component with React.useState() is being rendered twice?

This code will print to the console "App" once.
import React from "react";
export default function App() {
console.log('App');
 return (
 <div className="App">
 <h1>Hello CodeSandbox</h1>
 <h2>Start editing to see some magic happen!</h2>
</div>
);
}

And this two times
import React from "react";
export default function App() {
console.log('App');
 const [foo, setFoo] = React.useState(1);
 return (
 <div className="App">
 <h1>Hello CodeSandbox</h1>
 <h2>Start editing to see some magic happen!</h2>
</div>
);
}

Added one line
const [foo, setFoo] = React.useState(1);
April 19th 20 at 12:21
0 answer

Find more questions by tags ReactJavaScript