反应组件用户未处于状态

Question

考虑以下：

 componentDidMount(){
    this.props.requestUser(this.props.match.params.userID).then(res => 
      {
        this.pageOwner = res.user;
      debugger;
     })

  }

为什么我的this.pageOwner仍返回未定义？ 我一直在尝试让用户进入我的用户个人资料可以访问的状态。

Answer 1

如果您尝试访问this.pageOwner ，则需要在this.props.requestUser()异步函数完成后进行访问。 当前，您正在componentDidMount()获取用户，因此您的render()最初将this.pageOwner视为undefined直到异步调用完成。

此外，最好将异步调用的结果存储在state以便一旦填充该值即可重新渲染组件。

Answer 2

正如@colin所说，将其放在this.state 。 如果您在render()函数中遇到错误，则只需如下所示进行渲染即可：

constructor() {
 super();
 this.state = {
   pageOwner: null
 }
}

componentDidMount() {
 this.props.requestUser(this.props.match.params.userID).then(res => 
 {
  this.setState({pageOwner: res.user});
  debugger;
 })
}

render() {
 if(this.state.pageOwner) 
   return ( ... )
 else 
   return null;
}