Блог

Таким образом, все работает четко, пока я не нажму кнопку со стрелкой назад в браузере, насколько я знаю, эта кнопка просто делает window.history.back()

Ошибка:

 TypeError: Cannot read properties of null (reading 'getContext') render src/components/games/breakout/BreakoutGame.js:28  25 | useEffect(() =gt; {  26 | const render = () =gt; {  27 | canvas = canvasRef.current; gt; 28 | ctx = canvas.getContext("2d");  | ^ 29 |   30 |   31 |   

Мой код:

 export default function BreakOutGame() {  const canvasRef = useRef(null);   useEffect(() =gt; {  const render = () =gt; {  canvas = canvasRef.current;  ctx = canvas.getContext("2d");  /* Some Functions */   requestAnimationFrame(render);    };  render();  }, []);   return (  lt;gt;  lt;Navbargt;lt;/Navbargt;   lt;div className="breakout-game-content"gt;  lt;canvas  ref={canvasRef}  className="breakout-canvas"  onMouseMove={(event) =gt; {  (paddleProps.x = event.clientX - paddleProps.width / 2);   }}  height="500px"  width={window.innerWidth}  /gt;  lt;/divgt;  lt;/gt;  ); }  

У кого-нибудь есть решение о том, как перемещать страницы с маршрутом / ссылкой, пока ctx они все еще активны? Или как обойтись window.history.back() без получения этой ошибки?

Спасибо, что прочитали. Любой совет будет приветствоваться 🙂