如何使用 Firebase 用户数据设置状态？

Question

下面的 React 代码是一个包含两个状态项的组件 - 用户和许可证。两者都是在用户登录时更改的空字符串。

在 React 的 compoentDidMount 方法中使用 Firebase 的 onAuthStateChanged 方法非常适合获取用户信息。用户状态更改没有问题。但在这些方法中，我还调用了当前用户许可证的数据库。数据被毫无问题地获取，但我不断收到一个错误，说 setState 是未定义的。

我将 bind(this) 添加到 setState 并没有改变任何东西。同样的错误。

我觉得这是“this”关键字的问题，但我无法弄清楚它到底是什么。

这是代码...

class App extends Component {
  constructor() {
  super();
  this.state = {
    user: '',
    license: ''
  };
}

componentDidMount() {

  auth.onAuthStateChanged(user => {
    if(user){

      this.setState({user});
      let userId = auth.currentUser.uid;

      firebase.database().ref('/users/' + userId).once('value').then(function(snapshot) {
        var license = (snapshot.val() && snapshot.val().license);

        this.setState({license});
      });

    }else{
      console.log('no user');
    }
  });
}

Answer 1

这是“this”对象的经典范围问题。您必须将“this”绑定到这样的函数：

firebase.database().ref('/users/' + 
  userId).once('value').then(function(snapshot) {
    var license = (snapshot.val() && snapshot.val().license);

    this.setState({license});
  }.bind(this);