reactjs - 如何在 api 函数中设置状态

Question

我在类方法中有这段代码：

ref
      .orderByValue()
      .equalTo(email)
      .once("value", snapshot => {
        if (snapshot.exists()) {
          console.log(this);
          this.setState({ signedUp: true });
        } else {
          ref.update({ [newKey]: email });
        }
      });

除非用户已经注册，否则它将在提交时更新我的​​ Firebase 数据库。一个 typeError 说this.setState is not a function。但是当我控制台 log 时this，控制台会打印出类。日志记录this.state还会打印出状态。

我该如何解决？我想从这个函数内部更新我的状态。

Answer 1

最好的解决方案是使用功能组件。

但是，如果您想使用类组件，这可能是一个绑定问题。

因此，如果 this 在名为的函数内触发func，则应将此函数绑定到构造函数中。

...
constructor(props) {
...
this.func = this.func.bind(this);
...
}
func() {
...
ref
      .orderByValue()
      .equalTo(email)
      .once("value", snapshot => {
        if (snapshot.exists()) {
          console.log(this);
          this.setState({ signedUp: true });
        } else {
          ref.update({ [newKey]: email });
        }
      });
...
}

如果你不想绑定这个函数，你应该使用箭头函数。

func = () => {
...
}