setState z obietnicą Firebase w React

Question

Jak mogę ustawić stan wewnątrz komponentu reagowania?

`ve got komunikat o błędzie:

Uncaught TypeError: Cannot read property 'setState' of null

Oto Listing komponent:

class MessageList extends React.Component { 
constructor(props){ 
super(props); 
this.state = { 
    messages: [] 
}; 

var firebaseRef = firebase.database().ref(); 
firebaseRef.once('value') 
    .then(function(dataSnapshot) { 
     this.setState({ 
     messages: messages 
     }); 
    }); 
} 

render() { ... } 

} 

Answer 1

to odnosi się do obietnicy zakresie. Użyć tłuszczu funkcje strzałek (ES6)

var firebaseRef = firebase.database().ref(); 
firebaseRef.once('value') 
    .then((dataSnapshot) => { 
     this.setState({ 
     messages: messages 
     }); 
    }); 

Albo utworzyć kopię tego wcześniej obietnicy

constructor(props){ 
super(props); 
this.state = { 
    messages: [] 
}; 
var that = this; 
var firebaseRef = firebase.database().ref(); 
firebaseRef.once('value') 
    .then(function(dataSnapshot) { 
     that.setState({ 
     messages: messages 
     }); 
}); 

One ostatnią opcję, można powiązać to z obietnicą:

firebaseRef.once('value') 
.then(function(dataSnapshot) { 
    this.setState({ 
     messages: messages 
    }); 
}).bind(this) 

Answer 2

Najpierw chcę zasugerować, aby pobrać początkowy okres użytkowania komponentu i ustalić jego problem można śledzić poniższy kod w którym mam zmienić tylko linię self = this;,

class MessageList extends React.Component { 
constructor(props){ 
super(props); 
this.state = { 
    messages: [] 
}; 

componentDidMount() { 
var self = this; 
var firebaseRef = firebase.database().ref(); 
    firebaseRef.once('value') 
    .then(function(dataSnapshot) { 
    self.setState({ 
     messages: messages 
    }); 
    }); 
} 
} 

render() { ... } 

}