89

主要的两个 React Native 导航解决方案之间有哪些技术差异：React Native Navigation 和 React Native？

是否有特定的技术限制需要使用其中一种？

一种比另一种更广泛使用吗？

4

3 回答 3

92

NEW EDIT: As of today (07/2020) I suggest using React Navigation v5. It's the community solution being most pushed by Facebook. The V5 rewrite was a complete game changer and is far superior to previous versions. Easy to get setup and implementing easy/complicated stacks is a breeze most of the time.

If that's not doing it for you another alternative is react-native-navigation by WIX (not compatible with expo unfortunately).

React Native Navigation as the name says uses the native modules with a JS bridge, so performance will/may be better. This requires native integration.

While React Navigation is a simple and powerful solution provided by react native itself. Its an all JS implementation unlike the other that uses native support which can be tricky. Just npm-install and you're good to go ...

Use react navigation if you prefer an all JS implementation and use native navigation if your highest priority lies in performance .

  • Both libs have undergone drastic changes and entered next stable versions. react-navigation is more stable and performant now. If you have to handle complex computations in js go for react-native-navigation. but in most cases react-navigation will work for you!
  • With the advent of react-native-screens, the native screen optimisation is brought possible to react-navigation by bringing the native navigation component (UIViewController for iOS, and FragmentActivity for Android) Refer here

For those who are looking from a user experience view, both provides almost identical animations and flow so that you wouldn't know what lib is used behind the scenes. The major difference is the native side that can make performance better(which is crucial for a better user experience)

Both libs are amongst the best navigation solutions for React Native. Use it according to your need/preference.

于 2017-05-24T04:15:35.663 回答
3

通过使用原生控制器包装每个屏幕来使用原生导航来响应原生导航。所以性能是由原生领域优化的。您要实现的区域位于标题栏和标签栏内。

React Navigation 是纯 js 实现。它使用 React-native 根视图作为容器视图。每个屏幕都在根视图层次树下。

因此，如果您从 View Hierarchy 控制台打开应用程序，您会看到很大的不同（React Navigation 包含一堆奇怪的组件，例如多个标题或标签栏，树也很难理解）。

于 2019-03-07T19:39:05.437 回答
2

您应该尝试一下导航路由器。它提供了两全其美：iOS 和 Android 上的 100% 原生导航以及原生屏幕堆栈的 JavaScript 数组表示。

于 2019-05-11T12:45:11.093 回答