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?