reactjs - 在 React 中使用 Firebase Promise setState

Question

如何在 React 组件内设置状态？

我收到错误消息:

Uncaught TypeError: Cannot read property 'setState' of null

这里是组件代码 list :

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

this指的是promise范围。要么使用粗箭头函数(es6)

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

或者在 promise 之前创建一个副本

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
      });
 });

最后一个选项，您可以将其绑定(bind)到 promise :

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