React Native: 我应该使用哪种导航器?

31

我必须在3个月内构建一个相对较大的跨平台应用程序(iOS和Android)。

到目前为止,在React Native方面,我只有使用 NavigatorIOS 的经验。虽然我从来没有遇到过任何问题,但我从来没有看到人们推荐使用它。

其他选择是 Navigator,似乎足够简单,但可能不允许很多本地UI支持?NavigatorExperimental我一窍不通,单凭名字就令我担忧。我不想在最后一刻遇到任何噩梦。

我打算花一个月的时间彻底学习React Native,然后再花两个月的时间构建这个应用程序。

这就引出了我的问题:如果你不得不在React Native中构建跨平台应用程序,你会为每个平台使用哪种导航方式,并说明原因?

非常感谢任何答案或提示。


2
我只有使用过 Navigator 的经验,它非常简单并且到目前为止满足了我的需求。然而,我的导航栈非常简单,只能进行简单的前进和后退。这就是我所能分享的,因为我没有尝试过其他导航器。我看过 https://github.com/wix/react-native-navigation 这个网站。 - FMCorz
我看了一下,它似乎还不支持最新的 RN 版本,这很遗憾。但仍然有可能成为竞争对手。 - WillKre
1
截至今天,官方文档建议使用react-navigationreact-native-navigationnative-navigation。后两者是本地解决方案,第一个是基于JS的解决方案。 - Raunaqss
小心 https://github.com/react-community/react-navigation,在安卓上性能较差。 - cal
7个回答

35
作为自问自答者,我已经对不同的选项进行了大量研究,并自己尝试了所有主要选项。 最新编辑:截至今天(12/2021),我建议使用React Navigation v6。这是Facebook最推荐的社区解决方案。 V5重写是一个完全改变游戏规则的版本,比以前的版本要好得多,V6基于此构建。设置简单,实现简单/复杂的堆栈大多数情况下都很容易。
如果这对你来说不起作用,另一种选择是由wix提供的react-native-navigation(不幸的是与expo不兼容)。

请留意 airbnb 的 原生导航。它们已经在测试版中一段时间了,最近项目并没有太多更新,因此我仍然建议使用 React Navigation 进行生产。(编辑:避免使用 - 该项目已被放弃。)



以下是原始帖子:

TLDR: 截至今天(2017年1月13日),我仍然强烈建议使用React Native Router FluxEx-navigationExponent提供,是一个很好的替代方案。

我一直在使用RNRF进行我的项目,到目前为止它非常完美。超级导航栏和堆栈自定义(这对我来说非常重要),并且易于与其他包集成。


较长版本:(编辑:现在已过时)

导航器应该避免使用。 不详细解释原因,但Facebook已经放弃并不再维护它,这对我来说足以选择另一个导航。

NavigatorIOS:如其名称所示,仅适用于IOS,如果您想要跨平台应用程序,这并不是很好。当涉及到堆栈时,有一些差异,这对我来说比FB所追求的'一次学习,随处编写'更好。 话虽如此,如果您的iOS应用程序导航不是复杂,并且您不需要太多的导航栏自定义,则这是一个相当不错的选择,它利用本机UIKit导航,因此将自动呈现带有返回按钮和标题的导航栏。

NavigationExperimental: 不要被它的名字吓到,像我一样。 NavigationExperimental 对导航栈有很多控制,并允许更轻松的状态管理。除了第三方库外,这是导航选项。

Ex-Navigation: 我只引用 Facebook 的 React Native 团队的 Eric Vicenti 的话:

如果您对更加命令式的方法感兴趣,其中您可以调用方法来在应用程序中导航,类似于以前的 Navigator,则我绝对建议使用 ExNavigation。我们与 Exponent 相对密切地合作,因此这些事情不会以危险的方式分歧。

React Router Native: 文档说的很清楚。我只能说,如果您习惯于 React Router,则可能适合您。


请关注:React Native Navigation by WIX。看起来非常不错,但由于它在写这篇回答时与最新版本的React Native有些差距,所以我还没有尝试过。


有趣的 React Native 导航读物:

React Native - 我应该使用哪个导航器?

首次尝试:React Native 导航器实验部分 1


2
截至今天,React Native Navigation 支持使用 react-native 0.43 及以上版本的项目。 - Raunaqss
1
一旦稳定,NavigationExperimental将被弃用,转而使用React Navigation。React Navigation是Facebook、Exponent和React社区的人员之间的合作。react-navigation现在是官方Navigator库 https://github.com/react-community/react-navigation - Hitesh Sahu
1
不要使用React Navigation,它是我用过的最糟糕的库之一。以下是一些问题:https://github.com/react-community/react-navigation/issues/2031我建议使用React-native-navigation(wix),它使用本地屏幕和转换,而且更简单/功能强大。 - Oliver Dixon

3
你可以使用Ex-Navigation,它是基于NavigationExperimental构建的,并支持iOS和Android。此外,它还具有路由导航系统,并正确支持Android返回按钮。
如果您想继续使用Navigator JavaScript组件,我已经构建了react-native-navigator-wrapper,它是围绕Navigator API构建的简单包装器,支持最常见的导航模式,如push、pop和modals。

1
Ex-Navigation 真是太棒了! - Martin Konicek
2
200个问题,而且已经4个月没有更新了。不用了,谢谢。 - Oliver Dixon

2

React Navigation是这个领域的一个新项目。就个人而言,我认为它比不再维护的React Native Router Flux更好。

React Navigation具有许多良好的功能和适当的文档,其受欢迎程度正在迅速增长。据我所知,React核心开发者社区的成员在这个项目背后。看看它,你可能会喜欢上它。

编辑:React Navigation现在是官方导航库。


1
React Navigation很糟糕,不要使用它:https://github.com/react-community/react-navigation/issues/2031对于任何阅读此内容的人,我的建议是使用Wix Navigation,它更好,易于使用,具有React Navigation缺失的基本功能,并具有本地感觉。 - Oliver Dixon
Wix导航仍在实现他们的2.0版本,尚未推出。React Navigation现已成为官方导航库。 - Vinay
1
仅仅因为它是“官方”的,并不意味着它就是好的。这是我使用过的最糟糕的库之一。React-navigation是一种廉价的替代品,它不使用本地动画。 Wix要好得多,它不会在本地性能和缺少基本路由器功能方面出现问题。 - Oliver Dixon
1
就我个人而言,我认为它比其他现有的选项包括React Native Router Flux要好得多。它解决了我的问题。但是我同意,有些东西实现起来有点棘手。 - Vinay

2

这是一个非常老的项目,甚至作者都没有提及它。 - Vinay

1
RN图书馆每天都在推出。 在像您这样的情况下,我选择坚持使用router-flux以保持简单性,直到本地wix库开始支持更新的RN版本。 (据我记得,有很多问题涉及各种人员,因此非常活跃)。RN是基于组件的,沿途实施更改非常容易。 因此,不要像现在必须做出明确选择一样固定:)

0

有一个新项目React Navigation,用于易于使用的导航器。Facebook、Exponent和React社区都支持这个项目。


你对这与 Wix 的 react-native-navigation 相比有什么建议吗? - Raunaqss

0

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接