亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

<p>I need the user registration and login interface not to be displayed in the application's <code>TabBar</code> I have a simple application and I'm trying to have two types of user interface, one is guest mode and one is user authentication mode. I created a navigation for each <code>authentication</code> condition to display a TabBar for each state of the application, either guest mode or authentication mode. I also have a <code>TabBar</code> component to display the icon for each navigation. </p> <p>The problem arises when I want to add the <code>LoginScreen</code> and <code>RegisterScreen</code> screens because I don't have access to them. </p> <p>I tried creating a third <code>Navigation</code> (AuthNavigator) to manage these screens and eventually got access, but they show up on the TabBar, But this is not allowed, these screens are not accessible from <code>TabBar</code></p> <p>I need them to be in the navigation, but not displayed on the <code>TabBar</code>. </p> <p>These screens are not added in the <code>TabBar</code> file, so the <code>Icon</code> is not displayed, but the title</p> <p>I tried using <code>options={{ tabBarVisible: false }}</code> but it had no effect</p> <p>Also tried <code>display = "none"</code> without success. </p> <p>I looked for a solution on Google but didn't find anything. </p> <p>I would like to demonstrate my navigation system to guide me on what I am doing wrong and how to correct my mistakes.</p> <p>--------- App.js ---------</p> <pre class="brush:php;toolbar:false;">import React from 'react' import { NavigationContainer } from '@react-navigation/native' import GuestNavigator from './navigation/GuestNavigator' import AppNavigator from './navigation/AppNavigator' const App = () => { const isUserAuthenticated = false; return ( <NavigationContainer> {isUserAuthenticated ? ( <AppNavigator /> ) : ( <GuestNavigator /> )} </NavigationContainer> ) } export default App</pre> <p><strong>---這是訪客模式的導(dǎo)航---</strong></p> <p>---- GuestNavigator.JS -------</p> <pre class="brush:php;toolbar:false;">import { createBottomTabNavigator } from '@react-navigation/bottom-tabs'; import TabBar from '../components/TabBar'; const Tab = createBottomTabNavigator(); const GuestNavigator = ({ handleLogin }) => { return ( <Tab.Navigator tabBar={props => <TabBar {...props} />}> <Tab.Screen name="Home" component={HomeScreen} /> <Tab.Screen name="SampleNotas" component={SampleNotasScreen} /> <Tab.Screen name="SampleCuras" component={SampleCurasScreen} /> <Tab.Screen name="SamplePerfil" component={SamplePerfilScreen} /> <Tab.Screen name="Login" options={{ tabBarVisible: false }} children={() => <LoginScreen handleLogin={handleLogin} />} /> </Tab.Navigator> ); }; export default GuestNavigator;</pre> <p><em><strong>--這是認(rèn)證模式的導(dǎo)航--</strong></em></p> <p>------ AppNavigator.JS ---------</p> <pre class="brush:php;toolbar:false;">import { createBottomTabNavigator } from '@react-navigation/bottom-tabs'; import TabBar from '../components/TabBar'; const Tab = createBottomTabNavigator(); const AppNavigator = () => { return ( <Tab.Navigator tabBar={props => <TabBar {...props} />}> <Tab.Screen name="Notas" component={NotasScreen} /> <Tab.Screen name="CrearNota" component={CrearNotaScreen} options={{ tabBarVisible: false }} /> <Tab.Screen name="Curas" component={CurasScreen} /> <Tab.Screen name="Recordatorios" component={RecordatoriosScreen}/> <Tab.Screen name="Profile" component={ProfileScreen} /> <Tab.Screen name="EditProfile" component={EditarProfileScreen} options={{ tabBarVisible: false }} /> </Tab.Navigator> ); }; export default AppNavigator</pre> <p>我還為登錄和注冊創(chuàng)建了一個導(dǎo)航系統(tǒng)</p> <p>------- AuthNavigator.js ----------</p> <pre class="brush:php;toolbar:false;">import React from 'react' import { NavigationContainer } from '@react-navigation/native' import { createStackNavigator } from '@react-navigation/stack' import LoginScreen from '../screens/AuthScreens/LoginScreen' import RegisterScreen from '../screens/AuthScreens/RegisterScreen' const Stack = createStackNavigator() const AuthNavigator = () => { return ( <NavigationContainer> <Stack.Navigator> <Stack.Screen name="Login" component={LoginScreen} options={{ headerShown: false, }} /> <Stack.Screen name="Register" component={RegisterScreen} options={{ title: 'Registro', }} /> </Stack.Navigator> </NavigationContainer> ) } export default AuthNavigator</pre> <p>當(dāng)然，如果我從GuestNavigator導(dǎo)航中刪除LoginScrein，我會得到錯誤：</p> <p><strong>錯誤：未處理任何導(dǎo)航器的負(fù)載為{"name":"Login"}的動作'NAVIGATE'。 是否有名為'Login'的屏幕？ 如果您嘗試導(dǎo)航到嵌套導(dǎo)航器中的屏幕，請參閱https://reactnavigation.org/docs/nesting-navigators#navigating-to-a-screen-in-a-nested-navigator。 這只是一個開發(fā)時的警告，不會在生產(chǎn)中顯示。</strong></p> <p>我還顯示了TabBar，盡管它顯示了圖標(biāo)，但這些屏幕沒有添加。----- TabBar.js -----------</p> <pre><code>import React from 'react'; import { View, TouchableOpacity, Text } from 'react-native'; import Icon from 'react-native-vector-icons/Ionicons'; const TabBar = ({ state, descriptors, navigation, isUserAuthenticated }) => { return ( <View style={{ flexDirection: 'row', height: 60, backgroundColor: '#F3F9F5' }}> {state.routes.map((route, index) => { const { options } = descriptors[route.key]; const onPress = () => { const event = navigation.emit({ type: 'tabPress', target: route.key, }); if (!event.defaultPrevented) { navigation.navigate(route.name); } }; const isFocused = state.index === index; const color = isFocused ? '#08A438' : 'black'; let iconName; if (!isUserAuthenticated) { // Iconos para el modo invitado if (route.name === 'Home') { iconName = 'home'; } else if (route.name === 'SampleNotas') { iconName = 'list'; } else if (route.name === 'SampleCuras') { iconName = 'medkit'; } else if (route.name === 'SamplePerfil') { iconName = 'person'; } } else { // Iconos para el modo autenticado if (route.name === 'Notas') { iconName = 'notes'; } else if (route.name === 'Curas') { iconName = 'medkit'; } else if (route.name === 'Recordatorios') { iconName = 'alarm'; } else if (route.name === 'Profile') { iconName = 'person'; } } return ( <TouchableOpacity key={index} onPress={onPress} style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }} > <</code></pre>

const AuthNavigator = ({}) => {
  return (
    <Stack.Navigator>
      <Stack.Screen name="GuestStack" component={GuestNavigator}/>
      <Stack.Screen name="Login" component={LoginScreen}/>
      <Stack.Screen name="Register" component={RegisterScreen}/>
   </Stack.Navigator>
  );
};

const App = () => {    
  return (
    <NavigationContainer>
      {isAuth ? <AuthNavigator /> : <AppNavigator />}
    </NavigationContainer>
  )
}