React Native - представления Android перекрываются при запуске

Question

В моем App.js в настоящее время у меня есть этот код в функции рендеринга, которая условно отображает два стековых навигатора (React Navigation).

Код работает и прекрасно отрисовывается в iOS.

Этотакже работает на Android, но по какой-то причине в обоих случаях будут отображаться оба представления, перекрывающие друг друга в течение доли секунды.

Кто-нибудь знает, как можно избежать этих перекрывающихся представлений?

constructor(props) {
    super(props);
    this.state = {
        isLoadingComplete: false,
        firstLaunch: null,
    };
}

render() {
    if (!this.state.isLoadingComplete) {
        return (
            <AppLoading
                startAsync={this._loadResourcesAsync}
                onError={this._handleLoadingError}
                onFinish={this._handleFinishLoading}
            />
        );
    } else {
        return !this.state.firstLaunch ? <OnboardingStack /> : <MainStack />;
    }
}

Answer 1

Рендеринг условно работает нормально, если вы идете следующим образом.

    render() {
        if (!this.state.isLoadingComplete) {
           return (
               <AppLoading
                  startAsync={this._loadResourcesAsync}
                  onError={this._handleLoadingError}
                  onFinish={this._handleFinishLoading}
               />
    );
}
return !this.state.firstLaunch ? <OnboardingStack /> : <MainStack />;
return (
 <View>
  <ActivityIndicator />
 </View>
)