是什么导致组件在reactjs中使用钩子时呈现两次？

Question

这是示例代码

const [val,setVal] = React.useState('');
console.log("render");
return (
    <div className="App">
     <h1>Hello CodeSandbox</h1>
     <h2>Start editing to see some magic happen!</h2>
    </div>
 );

此处“渲染”将被渲染两次（在codesandbox上选中）。