this.setState가 함수가 아닙니다. setInterval react

Question

작은 뱀 게임을 작성하고 뱀의 방향을 바꾸는 데 어려움을 겪고 있습니다. 나는 아래에 전체 구성 요소를 포함시켰다. this.setState is not a function

이

가 changeDirection 방법에서 발생되는 :

나는 다음과 같은 오류를보고하고있다.

는 전체 코드 아래를 참조하십시오 :

이 클래스 함수에 결합되지

export default class Example extends Component { 

constructor(props){ 
    super(props); 
    this.state = { 
     snakeLeftPos: 0, 
     snakeDirection: 'right', 
     boardWidth: 20, 
     boardHeight: 20 
    }; 
    } 

componentDidMount() { 
    document.onkeydown = this.changeDirection; 
    setInterval(() => { 
     this.moveSnake(); 
    }, 1000); 
} 

moveSnake() { 
    const { boardWidth, snakeDirection} = this.state; 

    if(snakeDirection === 'right') { 
     this.setState((prevState) => { 
     return snakeDirection: prevState.snakeDirection + 20 
     }); 
    } 

    //same logic for other directions 
    } 

    changeDirection(e) { 
    switch(e.keyCode) { 
     case 37: 
     this.setState(() => { 
     return { 
      snakeDirection: 'left' 
     } 
     }); 
     break; 

     //other switch cases omitted for right, up, down 
    } 
    } 

    render() { 

    const { snakeLeftPos, boardHeight, boardWidth } = this.state; 
    return(
     <div> 
     <Snake snakeLeftPos={snakeLeftPos} /> 
     <Board boardHeight={boardHeight} boardWidth={boardWidth}/> 
     </div> 
    ) 
    } 

} 

Answer 1

, 당신은 수동으로 생성자에서 그것을해야,

이 시도 :

constructor(props){ 
    super(props); 
    this.state = { 
     snakeLeftPos: 0, 
     snakeDirection: 'right', 
     boardWidth: 20, 
     boardHeight: 20 
    }; 
    this.moveSnake = this.moveSnake.bind(this); 
    }