javascript - 如何通过异步函数设置 react 父组件状态，然后将此状态作为 Prop 传递给子组件？

Question

所以我想通过 firebase 函数设置访问权限，然后将此访问 Prop 作为 Prop 传递给选项卡组件，但选项卡组件的初始状态为 null，之后 firebase 身份验证功能正在解析。

class Admin extends React.Component {
  state = {
    access: null,
  };
  componentDidMount() {
    this.unListen = firebase.auth().onAuthStateChanged(user => {
      if (user) {
        this.setState(() => ({ access: true }));

      }
    });
  }

  componentWillUnmount() {
    this.unListen();
  }

render(){
return <Tab access={this.state.access}/>
  }
}

Answer 1

你可以做到 conditional rendering在您获得访问权限之前不呈现选项卡:

return this.state.access 
    ? <Tab access={this.state.access}/> 
    : <div>Not authorized</div>