画布在页面刷新时返回空。

Question

当我刷新页面时，为什么画布值为空？

function App() {
  let cavnas = document.getElementById("canvas");
  console.log(cavnas);//after refreshing no value is null 
  return <canvas id="canvas" className="border-4  border-sky-500"></canvas>;
}
export default App;

Answer 1

您的代码正在尝试从DOM中读取#canvas元素，在它将#canvas元素写入DOM之前的两行。它返回null，因为那里还没有任何东西。