関数で使用するとthis.stateは未定義です

Question

私は以下のReactコンポーネントを持っており、関数randomPosition（）からthis.state.board（各要素に0または1の2次元配列）にアクセスしたいと考えています。私がrandomPositionを呼び出すと、 "未定義のプロパティ状態を読み取ることができません"が返されます。このキーワードに何か問題がありますか？

var App = React.createClass({ 

getInitialState(){ 

    return { 

    board: [] 

} 

}, 

randomPosition: function(){ 
//generates a random position on this.state.board array 

    var position = []; 
    var positionX = null; 
    var positionY = null; 

    var generatePosition = function(){ 

    positionX = Math.floor(Math.random() * 64); 
    positionY = Math.floor(Math.random() * 64); 

    if(this.state.board[positionX][positionY] === 1){ 

     position.push(positionX, positionY); 
     return position; 

    } else { 

     generatePosition(); 

    } 

    } 

    generatePosition(); 

} 


}) 

助けてくれてありがとう！

Answer 1

generatePosition functionは独自の有効範囲を持つため、この機能内のthisは、外部範囲ではなく、stateにアクセスできます。あなたがouter scopeの参照を格納し、その後

randomPosition: function(){ 
//generates a random position on this.state.board array 

    var position = []; 
    var positionX = null; 
    var positionY = null; 
    var that = this; 
    var generatePosition = function(){ 

    positionX = Math.floor(Math.random() * 64); 
    positionY = Math.floor(Math.random() * 64); 

    if(that.state.board[positionX][positionY] === 1){ 

     position.push(positionX, positionY); 
     return position; 

    } else { 

     generatePosition(); 

    } 

    }