this.state在函数中使用时未定义React JS组件

Question

我在下面有React组件，我想从函数randomPosition（）访​​问this.state.board（每个元素为0或1的二维数组）。当我调用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(); 

    } 

    }