一个易于使用的导航解决方案，可用于React和React Native项目https://reactnavigation.org
我安装了反应本机导航。在我安装选项卡导航之前，我的堆栈导航器曾经正常工作。现在它给出了这个错误 错误 TypeError：buildLink 不是一个函数（它是 Objec...
如何关闭嵌套导航器中先前打开的屏幕，然后在不进行任何更改的情况下重新打开它
我有以下导航器结构 选项卡导航器 表1 堆栈导航器 屏幕A 屏幕B 表2 堆栈导航器 屏幕C 屏幕D 表3 堆栈导航器 屏幕E 屏幕F 屏幕 E 上有一个 for...
drawerContentOptions 在 React Native 的菜单抽屉中不起作用？
在我的反应本机应用程序中，我正在渲染带有一些路线的菜单抽屉。 当这条路线处于活动状态时，我想更改背景颜色，改善应用程序的视觉效果。 ...
如何在按下导航后退按钮时显示警报，但在按下简单按钮时不显示警报？
当我按下反应本机导航的后退按钮时，警报会按预期显示，但是当我按下简单按钮时，我想返回而不显示警报 这是我的代码 常量
React Native 构建失败：任务 ':react-native-reanimated:compileDebugJavaWithJavac' 执行失败
我在尝试构建 React Native 项目时遇到问题。构建过程失败并显示以下错误消息： 失败：构建失败并出现异常。 *发生了什么...
React-navigation：增加底部选项卡导航的高度？
我使用react-navigation为React Native应用程序创建了一个简单的选项卡导航。它工作正常，但我似乎无法调整它的高度。它最多只会达到 80 左右，我需要它大约...
React 导航 - 底部选项卡不会显示 tabBarIcon
我一直试图在我的反应导航选项卡栏上获得一个图标。这是我的代码片段： 从“反应”导入反应； 从“@react-navigation/native”导入{NavigationContainer}； 导入{
使用 Stack Navigator (Expo) 时出现 NSRangeException 错误
我正在尝试在我的 Expo 应用程序中制作堆栈导航，但是当我使用它时，当我尝试在手机上打开它时，我收到此错误： NSRangeException: *** -[__NSArrayM objectAtIndexedSubscript:]: 索引 0 b...
为什么 Gorhom 的 BottomSheet 不能在 iOS 上运行？
我一直在React-Native上开发一个应用程序。我面临的问题是，我已经在我的 React-Native 应用程序中实现了 gorhoms 底部工作表，当我单击当前位置时，它应该可以工作......
我正在使用 Expo Router 开发 React Native 项目，并且遇到了“后退”按钮上显示标题的问题。 导航结构： 我的导航结构是...
Expo Router React Native setParams() 不在屏幕上错误
我在使用 Expo Router 的 router.setParams() 方法时遇到问题。 我试图按照这里的例子： https://docs.expo.dev/router/reference/search-parameters/#updating-search-parameters...
如果我使用多个 useFocusEffects，为什么我的屏幕组件会渲染两次？
我正在使用两个 useFocusEffect() 挂钩（来自react-navigation-v6）。 当下面代码中显示的屏幕处于焦点时，它会呈现两次，而不是我期望的一次（console.log() ru...
我正在 React Native 中使用 Expo Router。我注意到当我使用 router.back() 时，前一个屏幕没有保持旧状态，它只是重新渲染。 例子： 导出默认 ScreenA = () ...
我正在开发一个全新的 iOS/Android 应用程序，我想使用单个代码，所以我决定为我的应用程序使用 ReactNative，并且我想自己构建可执行文件，而不是使用一些...
React 导航：`useLinkProps` 未在浏览器中生成正确的链接
我正在使用react-navigation v6和expo 49。Web的Bundler是webpack。 我需要反应导航方面的帮助。它是围绕如何生成链接的。我创建了一个链接配置，其中有一个配置l...
我刚刚升级到 Expo SDK 45，收到一条警告：“expo-app-loading 已被弃用，取而代之的是 expo-splash-screen：使用 SplashScreen.preventAutoHideAsync() 和 SplashScren.hideAsync() 代替......
我使用 React Navigation v6 创建了自定义底部选项卡导航，我提供图像作为底部导航的图标，如何在我的 CustomTabBar 中提供动态图像，当前...
如何使用 React Navigation 包将 Screen 和 WebView 的后退按钮合并到 React Native 中？
我正在学习 React Native 中的导航，并且不知道如何有条件地使用一个后退按钮。 想要的行为是这样的 - 如果用户在屏幕之间导航，他可以按 Go B...
headerLeft 在reactNavigation V3 中不起作用
我已经检查了以前的答案并尝试了不同的方法，但仍然不起作用。仅当我在屏幕内使用静态导航选项时它才有效 我尝试使用 defaultNavigationOptions 但不行
当我渲染 React Native Vision 相机时，React 导航页面过渡动画未显示
我正在使用 React Navigation 和 React Native Vision Camera 开发移动应用程序。 我正在使用 native-stack 并将动画添加到每个 Stack.Screen 中。 我正在使用 React Navigation 和 React Native Vision Camera 开发移动应用程序。 我正在使用本机堆栈并将动画添加到每个Stack.Screen。 <Stack.Screen ... options={{animation: 'slide_from_right',...}} /> 它们运行良好，直到我将用户从ScanScreen导航回来，其中包含反应本机视觉相机组件。 我的工作流程是Home -> Scan -> Result -> back to Home。 当我导航到ScanScreen时，动画正在工作，但如果我在goBack()中调用ScanScreen，或在popToTop()中调用ResultScreen，动画就会消失，应用程序看起来有点卡住。 这是我的代码ScanScreen const ScanScreen = ({route, navigation}) => { const {locations} = route.params; // permission const {hasPermission, requestPermission} = useCameraPermission(); // if camera page is active const isFocussed = useIsFocused(); const isForeground = useIsForeground(); const isActive = isFocussed && isForeground; // camera torch control const [torch, setTorch] = useState('off'); // get device const device = useCameraDevice('back'); // inititalization const [isCameraInitialized, setIsCameraInitialized] = useState(false); const onInitialized = useCallback(() => { console.log('Camera initialized!'); setIsCameraInitialized(true); }, []); const codeScanner = useCodeScanner({ codeTypes: ['qr', 'ean-13'], onCodeScanned: codes => { onQRCodeScan({codes}); }, }); useFocusEffect( useCallback(() => { if (!hasPermission) { requestPermission(); } return () => { // setIsCameraReady(false); }; }, []), ); {device != null && ( <Camera style={{flex: 1}} device={device} isActive={isActive} onInitialized={onInitialized} codeScanner={codeScanner} torch={torch} /> )} }) 我在想视觉相机是否太重了？或者也许我正在处理错误的生命周期。我还没有在IOS上尝试过。 我尝试在离开页面之前停用相机，但是在我可以之后，transitionStart 没有被触发 goBack() React.useEffect(() => { const unsubscribe = navigation.addListener('transitionStart', (e) => { // Do something }); return unsubscribe; }, [navigation]); 您可以自己处理这个问题Stack.Navigator您不应该在每个屏幕上使用。 喜欢： <Stack.Navigator initialRouteName="Tabs" screenOptions={screenOptions}> <Stack.Screen name={Route.SPECS_FEATURES} component={SpecAndFeatures} options={{headerShown: false, gestureEnabled: false}} /> </Stack.Navigator> 屏幕选项 const screenOptions = { cardStyle: {backgroundColor: colors.background, opacity: 1}, headerShadowVisible: false, headerBackTitleVisible: false, headerTitleAlign: 'center', gestureDirection: 'horizontal', gestureEnabled: false, cardStyleInterpolator: CardStyleInterpolators.forHorizontalIOS, headerTitleStyle: {color: 'white', justifyContent: 'center'}, transitionSpec: {open: config,close: closeConfig}, }; 我的配置 const config = { animation: 'spring', config: { stiffness: 1000, damping: 100, mass: 3, overshootClamping: false, restDisplacementThreshold: 0.01, restSpeedThreshold: 0.01, }, }; 我的closeConfig： const closeConfig = { animation: 'timing', config: { duration: 400, stiffness: 1000, damping: 500, mass: 100, overshootClamping: false, restDisplacementThreshold: 0.5, restSpeedThreshold: 0.5, }, }; 如果您想更改导航动画样式，您应该在 cardStyleInterpolator: CardStyleInterpolators.forHorizontalIOS 中进行更改，它提供了许多您想要的默认动画，您也可以在 config 或 closeConfig 中更新以更改动画样式。 了解更多详情，您可以访问CardStyleInterpolators