如何在導航器中使用導航欄？

Question

https://facebook.github.io/react-native/docs/navigator.html#content

的導航欄節點

選擇性地提供跨場景持續 轉換

文檔沒有給出例子或者知道這是什麼參數需要一個導航欄。我使用Navigator，發現沒有帶路線標題和後退按鈕頂吧，所以我想我要補充它在某種程度上使用navigationBar，但我無法弄清楚如何。

Answer 1

你可以使用這樣的：

<Navigator 
    initialRoute={{name: 'My First Scene', index: 0}} 
    renderScene={(route, navigator) => { 
    return <Page navigator={navigator} name={route.name} index={route.index}/> }} 
    navigationBar={ 
    <Navigator.NavigationBar routeMapper={NavigationBarRouteMapper} />} 
/> 

var NavigationBarRouteMapper = { 
    LeftButton(route, navigator, index, navState) { 
    if(index > 0) { 
     return (
     <TouchableHighlight style={{marginTop: 10}} onPress={() => { 
      if (index > 0) { 
       navigator.pop(); 
      } 
     }}> 
     <Text>Back</Text> 
    </TouchableHighlight> 
)} else { 
return null} 
}, 
    RightButton(route, navigator, index, navState) { 
    return null; 
    }, 
    Title(route, navigator, index, navState) { 
    return <Text>My Title</Text> 
    } 
}; 

Here是陣營本地導航欄示例項目文件夾：https://github.com/facebook/react-native/blob/master/Examples/UIExplorer/Navigator/NavigationBarSample.js

兩個其他的方式來了解這個：

1. 下載React Native並在UI Explorer project運行Navigator Examples（這本身是一個很酷的PLA以瞭解所有本地模塊/組件）。

2. Here與實施的導航欄一個RNPlay項目。