跳至主要内容
版本:6.x

导航解决方案和社区库

注意

本指南中列出的库可能尚未更新以与最新版本的 React Navigation 兼容。请参阅库的文档以查看它支持的 React Navigation 版本。

基于 React Navigation 构建的解决方案

Solito

一个围绕 React Navigation 和 Next.js 的小型包装器,可让您跨平台共享导航代码。此外,它还提供了一套用于使用 React Native + Next.js 构建跨平台应用程序的模式和示例。

文档

github.com/nandorojo/solito

Expo Router

用于 React Native 应用程序的基于文件的路由器。使用 Expo Router,只需在项目中创建文件即可自动生成页面。

文档

github.com/expo/router

一个建立在 React Navigation 之上的导航库。它的主要目标是通过在一个地方构建应用程序布局并使用 TypeScript 的强大功能来提供路由名称自动完成来改善 DX。

github.com/kanzitelli/rn-navio

Snack 上的演示

社区库

react-native-screens

该项目旨在将本机导航容器组件公开给 React Native,并且 React Navigation 可以从 2.14.0 版本开始与之集成。使用 react-native-screens 带来了许多好处,例如对 iOS 上的 "可达性功能" 的支持,以及在两个平台上都提高了内存消耗。

github.com/software-mansion/react-native-screens

react-navigation-header-buttons

帮助您在导航栏中渲染按钮并处理样式,因此您无需这样做。它试图模仿本机导航栏按钮的外观,并试图为您提供一个简单的界面来进行交互。

github.com/vonovak/react-navigation-header-buttons

expo 上的演示

react-navigation-props-mapper

提供简单的 HOC,将 react-navigation 属性直接映射到您的屏幕组件 - 例如,而不是 const user = this.props.route.params.activeUser,您将编写 const user = this.props.activeUser

github.com/vonovak/react-navigation-props-mapper