He estado trabajando en reaccionar durante bastante tiempo. Me siento mal por decir esto. pero no podía dejar de hacer esta pregunta aquí.

Escribí un componente de reacción simple y traté de entender por qué el registro de la consola se imprime dos veces.

 function Comp1(props) { return ( <div className="App"> <button onClick={props.handleClick}>Hello CodeSandbox</button> </div> ); } function Comp2(props) { console.log(new Date()); return <>Comp2</>; } export default function App() { const [value, setValue] = useState(); const handleClick = () => { setValue("clicked"); }; return ( <div className="App"> <Comp1 handleClick={handleClick}>Hello CodeSandbox</Comp1> <Comp2 value={value}></Comp2> </div> ); }

aquí está el enlace de codesandbox.

https://codesandbox.io/s/multiple-renders-1l47cf?file=/src/App.js:148-159