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>
)

React Native - Android视图在启动时重叠

1 个答案: