问题
I have to build a relatively big cross-platform (iOS & Android) application within 3 months.
So far when it comes to React Native I only have experience with NavigatorIOS. Now while I never really ran into any problems with it I never see people recommending its use.
The other options are Navigator, which seems simple enough but maybe doesn't allow much native UI support? and NavigatorExperimental which I know nothing of, and the name alone worries me. I don't want to be having any last minute nightmares.
I plan on spending a month learning React Native thoroughly and then 2 months building the application.
This leads me to my question: If you had to build a cross platform application in React Native, which navigation would you use for each platform, and why?
Any answers or tips greatly appreciated.
回答1:
Answering my own question as I've done quite a bit of research on the different options out there, and tried all the main ones out myself.
NEW EDIT: As of today (14/3/2019) I suggest using React Navigation v3. It's the community solution being most pushed by Facebook. It's far from perfect - I find it difficult to get going and the docs in my opinion are terrible, but once it's set up it gets the job done.
If that's not doing it for you another alternative is react-native-navigation by wix (not compatible with expo unfortunately).
Keep an eye on native-nagivation by airbnb. They've been in beta for a while and not much has been pushed to the project recently so I'd still suggest React Navigation for prod. (edit: avoid - this project has been dropped.)
original post below:
TLDR: As of today (13/01/2017) I would still highly suggest React Native Router Flux. With ex-navigation, by Exponent being a great alternative.
I have been using RNRF for my project and it's been perfect so far. Superb navbar & stack customization (which was a big thing for me) and easy to integrate with other packages.
Longer version: (edit: out of date now)
Navigator: To be avoided. Without going into details why, the fact that Facebook have dropped it and are no longer maintaining it is to me, a big enough reason to choose another navigation.
NavigatorIOS: As the name states, only available on IOS, which isn't great if you're going for a cross-platform application. There are a couple of difference when it comes to stacking which to me, beats the whole 'learn once, write anywhere' thing FB are going for. With that said, if your iOS app's navigation isn't too complicated, and you're not looking for too much navbar customisation this is a fairly good choice which leverages native UIKit navigation, so will automatically render a navigation bar with a back button and title.
NavigationExperimental: Don't be scared off by it's name like I was. NavigationExperimental has lots of control over the navigation stack, and allows for much easier state management. Excluding 3rd party libraries, this is to go to navigation option.
Ex-Navigation: I'll just quote Eric Vicenti of Facebook, who's on the React Native team:
If you are interested in a more imperative approach, where you can sort of make method calls to navigate throughout your application in a way similar to the previous Navigator, then I would definitely recommend ExNavigation. We’re working relatively closely with Exponent so these things are not going to sort of diverge in dangerous ways.
React Router Native: The docs say it all. All I can say is if you're used to React Router, this could be for you.
Keep an eye on: React Native Navigation by WIX. Looks very decent but I haven't given it a go given the fact it's a bit behind the latest version of react native (when writing this answer).
Interesting RN Nav reads:
React Native — Which Navigator should I use?
First look: React Native Navigator Experimental Part 1
回答2:
You can use Ex-Navigation which is built on top of NavigationExperimental and supports both iOS and Android. Plus, it has a route navigation system and correctly supports the Android back button.
If you want to keep using the Navigator JavaScript component, I've built react-native-navigator-wrapper which is a simple wrapper around the Navigator API that supports the most common navigation patterns like push, pop and modals.
回答3:
I have been using react-native-router-flux and it is very flexible. You can check it out.
回答4:
React Navigation, a new project in this territory. Personally I find it better than React Native Router Flux which is not being maintained anymore.
React Navigation has lot of good features with proper documentation. It's popularity is growing rapidly. AFAIK, React core developer community guys are behind this project. Check this out, you probably gonna like it.
EDIT: React Navigation is now official navigation library.
回答5:
RN libraries are coming out each day. In a similar situation like you these days, my choice is sticking with router-flux for simplicity until native wix library starts supporting newer RN Versions. (As I remember, there are lost of issues mentioning involvment of various people, so it is pretty active).RN is components based, it is quiet easy to implement changes along the way. So dont fixate like you have make a definite choice now :)
回答6:
I've only ever used React Router Native and never had any problems.
回答7:
There is a new project React Navigation for easy to use navigators. Facebook, Exponent and the React community are behind the project.
来源：https://stackoverflow.com/questions/39976957/react-native-which-navigator-should-i-use