> react-navigation包含了一下三類導航器:
> StackNavigator:用于提供屏幕(頁面)之間的互相跳轉。當一個新的屏幕打開的時候,他被顯示在最頂部。
> TabNavigator :一個切換卡,用于多個屏幕之間的切換。
> DrawerNavigator -:提供一個從屏幕左側劃出的抽屜。用于放菜單選項。
* * * * *
### **屏幕渲染導航器**
導航器僅僅是react的一個響應式組件。
要學習如何創建屏幕,請閱讀:
`navigation` 的 `prop` 允許屏幕適配一個 `navigation`,比如新打開一個屏幕。
`navigation` 的 `navigationOptions` 用來定制一個導航器,比如頭部標題,標簽等。
* * * * *
#### **在頂級組件上調用導航**
如果你想要是用來自同一級別的導航器,那么你可以使用 `React` 的 `ref` 選項。
~~~
const AppNavigator = StackNavigator(SomeAppRouteConfigs);
class App extends React.Component {
someEvent() {
// call navigate for AppNavigator here:
this.navigator && this.navigator.dispatch({ type: 'Navigate', routeName, params });
}
render() {
return (
<AppNavigator ref={nav => { this.navigator = nav; }} />
);
}
}
~~~
請注意這個方法僅僅適用于頂級導航器。
* * * * *
### **Navigation 容器**
> 當 `navigation` 的 `prop`屬性丟失時,內置導航器將自動成為頂級頂級的導航器(navigators),這個功能提供了一個透明的導航容器,這將成為一個頂級導航器。
> 當呈現其中一個導航器時,導 `navigation` 的 `prop` 可選的。當它丟失時,容器將進入并管理它自己的導航狀態。它還可以處理url、外部鏈接和Android back按鈕。
> 為了方便,內置的 導航器 有這個能力,因為他們在幕后使用 `createNavigationContainer`。通常,導航器需要一個 導航支柱 `navigation prop `才能正常工作。
頂級導航器接受以下的props":
`onNavigationStateChange(prevState, newState, action)`
#### **uri前綴(uriPrefix )**
app可能處理一個uri前綴,當處理一個深鏈接以提取傳遞到路由器的路徑時,將使用該方法。