react-native-router-flux 是一款別人開源專門切換 router 的 Component，他是在 React Native Navigator 上面再包一層簡單易用的 API 讓我們可以簡單地使用。

使用方法一樣直接 import

import {Scene, Router} from 'react-native-router-flux';

然後我們就能定義一些 Route 他的階層關係和切換的 key

class App extends React.Component {
  render() {
    return <Router>
      <Scene key="root">
        <Scene key="login" component={Login} title="Login"/>
        <Scene key="register" component={Register} title="Register"/>
        <Scene key="home" component={Home}/>
      </Scene>
    </Router>
  }
}

這邊定義的 key 就是以後我們能拿來切換 Route 的關鍵字，像是這樣

import {Actions} from 'react-native-router-flux'
Actions.home()

Actions.home() 這樣的話我們就會把當前的頁面切到 Home component，非常方便而且上方的 Navigator 也會有返回按鈕能直接使用，除了切換頁面，我們也能把 props 傳進去像是這樣

Actions.home({ desc: 'Hello React Native' })

這樣子他就會把 desc 當作 props 傳進 Home component，Home component 就能拿到資料摟，不過這裡有一個小地雷，就是 title、type 是 react-native-router-flux 的保留字，需要致意不要覆蓋掉摟

官方範例

而且除了切換 Route 外他也有提供 Tab 的功能，大家可以去探索官方的文件喔～

有問題歡迎來 React Native Taiwan 問喔
[創科資訊](https://www.facebook.com/trunk.studio.tw/?fref=ts