反応するネイティブNavigator.NavigationBar - ドキュメントはどこにありますか？

Question

Navigator.NavigationBarを使用してオンラインでいくつかの例を見ました。それは便利に見えますが、私はそれを使う方法を知らない。どこに文書がありますか？

Answer 1

公式にはガイドナビゲーターはありません。ナビゲーションバー。しかし、インターネットを見れば、それがどのように動作するのかの例が見つかります。以下は私のプロジェクトの1つに使用した例です。

var PageOne = require('./pageone'), 
    PageTwo = require('./pagetwo'); 


var NavigationBarRouteMapper = { 
    LeftButton: function(route, navigator, index, navState){ 
    return(
     <Text>{ route.leftButton }</Text> 
    ) 
    }, 
    Title: function(route, navigator, index, navState){ 
    return(
     <Text>{ route.title }</Text> 
    ) 
    }, 
    RightButton: function(route, navigator, index, navState){ 
    return(
     <Text>{ route.rightButton }</Text> 
    ) 
    } 
} 

var App = React.createClass({ 

    renderScene: function(route, nav) { 
    switch (route.id) { 
     case 'PageOne': 
     return <PageOne navigator={ nav } title={ "PageOne" } /> 
     case 'PageTwo': 
     return <PageTwo navigator={ nav } leftButton={ "Back" } title={ "PageTwo" } />; 
    } 
    }, 

    render: function() { 
    return (
     <Navigator 
     initialRoute={{ id: 'PageOne', title: 'PageOne' }} 
     renderScene={ this.renderScene } 
     configureScene={(route) => { 
      if (route.sceneConfig) { 
      return route.sceneConfig; 
      } 
      return Navigator.SceneConfigs.FloatFromRight; 
     }} 
     navigationBar={ 
      <Navigator.NavigationBar 
      routeMapper={ NavigationBarRouteMapper } 
      /> 
     } 
     /> 
    ); 
    }, 
}); 

Answer 2

私もそれを使用する方法を示す例でUIエクスプローラをチェックアウトする追加します。 UIExplorer Navigator -

EDIT：React nativeはドキュメントを更新しています。ここにナビゲーターへの文書があります：navigator docs

更新：自分自身を好きにして、反応ナビゲーションのようなものを使ってください。これらのリンクは、RNへの多くの更新のために壊れてしまいます。

Answer 3

更新日2017：Official documentation of React Nativereact-navigationライブラリを使用することをお勧めします。

セットアップ変数：

import { 
    StackNavigator, 
} from 'react-navigation'; 

const App = StackNavigator({ 
    Home: { screen: HomeScreen }, 
    Profile: { screen: ProfileScreen }, 
}); 

例：

class HomeScreen extends React.Component { 
    static navigationOptions = { 
    title: 'Welcome', 
    }; 
    render() { 
    const { navigate } = this.props.navigation; 
    return (
     <Button 
     title="Go to Jane's profile" 
     onPress={() => 
      navigate('Profile', { name: 'Jane' }) 
     } 
     /> 
    ); 
    } 
} 

詳細な情報については、公式ドキュメントを読んでください。