Recoil, Classes and Typescript - "Cannot assign to read only property 'positions' of object '#<Snake>'"

59 Views Asked by At

i'm creating a snake game with react and i'd like to run the controls actions with a class storaged with a recoil atom:

game_controller.ts:

export const state_game_controller = atom<GameController | undefined>({
  "key": "GameController",
  "default":  undefined
})

export const useChangeSnakeDirection = () => {
  const game_controller = useRecoilValue(state_game_controller)
  return (dir:TDirections) => {
    game_controller?.changeSnakeDirection(dir)
  }
}

export const useStartGame = () => {
  const game_controller = useRecoilValue(state_game_controller)
  return () => {
    game_controller?.startGame()
  }
}

app.tsx:

export const App = () => {
  const startGame = useStartGame();

  return (
    <>
      <Board />
      <button onClick={() => startGame()}>Inicar jogo</button>
      <Control />
    </>
  );
};

Althogh, when i click on the start button of app.tsx, i'm receiving this error:

Cannot assign to read only property 'positions' of object '#<Snake>'

The game controller class atributes are being declared this way:

private canvas: HTMLCanvasElement;
  private gameboard: GameBoard
  private snake: Snake
  private apple: Apple
  private canvas_drawer: CanvasDrawer
  private loop: Loop
  private score: number

I dunno if it matters or not, but i imagine maybe is something with this.

I was expecting to the snake direction changes just changing react atom propertys Someone can help me with it?

0

There are 0 best solutions below