javascript - 组件上的异步等待已挂载

Question

这是我的 componentDidMount 方法。我想设置当前用户的状态，然后在设置该用户时调用该函数。我该怎么做？

  componentDidMount = () => {
    firebase.auth().onAuthStateChanged((user) => {
      if (user) {
        this.setState({user: user})
      }
    });
    this.props.retrieveMatches(this.state.user.uid)
  }

我试过使用 async/await 但我在这里没有正确使用它:

  async componentDidMount = () => {
    await firebase.auth().onAuthStateChanged((user) => {
      if (user) {
        this.setState({user: user})
      }
    });
    this.props.retrieveMatches(this.state.user.uid)
  }

基本上我想在第 7 行调用 props 函数之前等待第 2-6 行

Answer 1

你需要使用.setState()的回调函数:

componentDidMount = () => {
  firebase.auth().onAuthStateChanged((user) => {
    if (user) {
      this.setState({user: user}, () => { 
        this.props.retrieveMatches(this.state.user.uid); 
      })
    }
  });
}

问候