はSETSTATEがエラー

Question

SETSTATEを使用しようとすると、私は次のエラーを取得する

を取得し、動作していない反応します。この文脈はもうコンポーネントではないので、これが起こっている

export default React.createClass({ 
    getInitialState: function() { 
     return { 
     name: '', 
     address: '', 
     phone: '', 
     email: '', 
    } 
    }, 

    componentWillMount(){ 
    this.getUserDetails(); 
    }, 

    getUserDetails: function(){ 
    var personID = 'ABC123'; 
    if(personID.length > 0){ 
     new Firebase('https://xxxxxxxxxx.firebaseio.com/users/' + personID).on('value', function(snap) { 

     this.setState({ 
      name: snap.val().Name + " " +snap.val().Surname 
     }); 

     }); 
    } 
    }, 
    render() { 
    return (...); 
    } 
}); 

Answer 1

あなただけの矢印関数にこれを編集した場合、それは外側のスコープにFirebaseからthisのコンテキストを変更し、上記の言っている - コンポーネントです。

new Firebase('https://xxxxxxxxxx.firebaseio.com/users/' + personID).on('value', (snap) => { 

    this.setState({ 
     name: snap.val().Name + " " +snap.val().Surname 
    }); 

    }); 

Answer 2

： はここに私のコードです。これはコンポーネントの必要があります。このコンポーネントをどのように取得するかを確認してください。人々のよう

export default React.createClass({ 
    getInitialState: function() { 
     return { 
     name: '', 
     address: '', 
     phone: '', 
     email: '', 
    } 
    }, 

    componentWillMount(){ 
    this.getUserDetails(); 
    }, 

    getUserDetails: function(){ 
    var that = this 
    var personID = 'ABC123'; 
    if(personID.length > 0){ 
     new Firebase('https://xxxxxxxxxx.firebaseio.com/users/' + personID).on('value', function(snap) { 

     that.setState({ 
      name: snap.val().Name + " " +snap.val().Surname 
     }); 

     }); 
    } 
    }, 
    render() { 
    return (...); 
    } 
});