Мне нужно показывать модальное окно NetAlert на каждом экране, когда интернет не работает. Для этого я создал компонент NetAlertModal. Я не уверен, где визуализировать этот компонент. Я использую навигатор React Navigation Switch. Если я выполняю рендеринг, как показано ниже, экран входа в систему не отображается.
Я новичок, чтобы реагировать на родные, поэтому, пожалуйста, помогите.
Ниже мой код
/***App.js*/
render() {
return (
<Provider store={store}>
<PersistGate>
<Fragment>
<StatusBar barStyle="dark-content" />
<SafeAreaView
style={styles.safeArea}
forceInset={{bottom: 'never', top: 'never'}}>
<NetAlertModal /> <------ Need to show this
<RootNav
ref={navigatorRef => {
NavigationService.setTopLevelNavigator(navigatorRef);
}}
/>
</SafeAreaView>
</Fragment>
</PersistGate>
</Provider>
);
}
}
/*rootNav.js*/
const RootNav = createSwitchNavigator(
{
Drawer: DrawerNavigator,
Auth: AuthStack,
},
{
initialRouteName: 'Auth',
},
);
export default createAppContainer(RootNav);
*/AuthStack.js*/
import {createStackNavigator} from 'react-navigation';
import Login from '../components/login/Login';
import Verify from '../components/verify/Verify';
const rootConfiguration = {
loginPage: {screen: Login},
verifyPage: {screen: Verify},
};
const stackNavigatorConfiguration = {
initialRouteName: 'loginPage',
headerMode: 'none',
defaultNavigationOptions: {
headerTintColor: '#ffeb3b',
headerTitleStyle: {
fontWeight: 'bold',
flex: 1,
textAlign: 'center',
},
},
};
export const AuthStack = createStackNavigator(
rootConfiguration,
stackNavigatorConfiguration,
);