ReactJs：如何在渲染之前等待componentDidMount（）完成？

ReactJs：如何在渲染之前等待componentDidMount（）完成？

不要等待

componentDidMount

渲染完成，否则会滥用该库，请等待您

authUser

完成。

您可以通过结合使用

isAuthenticating

state属性来实现

promises

。

function authUser() {   return new Promise(function (resolve, reject) {      firebase.auth().onAuthStateChanged(function(user) {         if (user) { resolve(user);         } else { reject('User not logged in');         }        });   });}

您可以

isAuthenticating

如下使用现有标志：

componentDidMount() {    authUser().then((user) => {       this.userHasAuthenticated(true);       this.setState({ isAuthenticating: false });    }, (error) => {       this.setState({ isAuthenticating: false });       alert(e);    });}

然后在内部渲染：

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

这将防止您的组件在

authUser

功能完成之前被添加到DOM中。