Question

嘿，我正在使用react native来为Android，iOS和Web构建应用程序，我正在使用https://reactnative.dev/docs/navigation进行导航，它在android和IO上都可以正常工作，但是在Web上我偶然发现了2个问题。首先是下一个始终在同一页面上打开的屏幕，我希望它转到新页面。其次，假设我在堆栈的第三个屏幕上，如果我在浏览器中单击了刷新，它将转到第一个屏幕（在我的情况下，第一个屏幕是登录屏幕）。我该怎么办才能解决这个问题？还有其他我应该用于Web，Android和ios的导航框架，还是您有完全不同的建议？

import 'react-native-gesture-handler';
import { StatusBar } from 'expo-status-bar';
import React from 'react';
import {
  StyleSheet,
  Text,
  View,
} from 'react-native';
import { NavigationContainer, StackActions } from "@react-navigation/native";
import { createStackNavigator } from "@react-navigation/stack";
import LoginScreen from './screen/LoginScreen';
import HomeScreen from './screen/HomeScreen';
import AboutUsScreen from './screen/AboutUsScreen';
import ProgramsScreen from './screen/ProgramsScreen';
import ResourcesScreen from './screen/ResourcesScreen';
import NewsScreen from './screen/NewsScreen';

const Stack = createStackNavigator();

export default function App() {
  return (
    <NavigationContainer>
      <Stack.Navigator
        screenOptions={{ headerShown: true }}
      >
        <Stack.Screen name="LoginScreen" component={LoginScreen} />
        <Stack.Screen name="HomeScreen" component={HomeScreen}/>
        <Stack.Screen name="AboutUsScreen" component={AboutUsScreen}/>
        <Stack.Screen name="ProgramsScreen" component={ProgramsScreen}/>
        <Stack.Screen name="ResourcesScreen" component={ResourcesScreen}/>
        <Stack.Screen name="NewsScreen" component={NewsScreen}/>
      </Stack.Navigator>
    </NavigationContainer>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});

Answer 1

对于寻找答案的任何人，我都解决了，我创建了2个App.js文件，Web的App.js和android的App.android.js。在App.android.js中，我使用了反应导航进行导航和在我使用路由的网络上，使用路由消除了刷新应用程序将跳转到登录屏幕的页面的问题。

反应本机导航（Web，Android和ios）返回第一个屏幕

1 个答案: