react-native Navigator Best Practices react-native Navigation with react-native-router-flux
Example
Install by using npm install --save react-native-router-flux
In react-native-router-flux, each route is called a <Scene>
<Scene key="home" component={LogIn} title="Home" initial />
key A unique string that can be used to refer to the particular scene.
component Which component to show, here it's
title make a NavBar and give it a title 'Home'
initial Is this the first screen of the App
Example:
import React from 'react';
import { Scene, Router } from 'react-native-router-flux';
import LogIn from './components/LogIn';
import SecondPage from './components/SecondPage';
const RouterComponent = () => {
return (
<Router>
<Scene key="login" component={LogIn} title="Login Form" initial />
<Scene key="secondPage" component={SecondPage} title="Home" />
</Router>
);
};
export default RouterComponent;
Import this file in the main App.js(index file) and render it. For more information can visit this link.
