2016-01-11 21 views
5

React Native 0.16(Android)の使用に問題があります。 質問はどのように小道具をrouteMapperに渡すかです。Navigator.NavigationBarは、<Navigator />コンポーネントに属しています。あなたはあなたのコードでは、関数を使ってマッパーオブジェクトを毎回生成することができますReact Native:Navigator.NavigationBarの 'routeMapper'に小道具を渡す方法は?

class MyApp extends Component {  
    ... 

    static NavigationBarRouteMapper = { 
     LeftButton(route, navigator, index, navState) { 
      // ### I want to call 'functionABC' here. What Should I do? 
     }, 
     RightButton(route, navigator, index, navState) { 
      // ### I want to call 'functionABC' here. What Should I do? 
     },    
     Title(route, navigator, index, navState) { 
      // ### I want to call 'functionABC' here. What Should I do? 
     },   
    }  

    ... 

    functionABC() { 
     ... 
    }  

    ... 

    render() { 
     return (
      <View> 
       <Navigator 
       initialRoute={{ 
       name: 'Main', 
       index: 0, 
       }} 
       renderScene={this.renderScene.bind(this)} 
       sceneStyle={{marginTop:50}} 
       navigationBar={ 
        <Navigator.NavigationBar 
        routeMapper={MyApp.NavigationBarRouteMapper} 
        /> 
       } 
       ref="nav" /> 
      </View> 
     ); 
} 

答えて

10

以下のように

私のコードの構造これは単なる可能性:

class MyApp extends Component {  
    ... 

    static NavigationBarRouteMapper = props => ({ 
     LeftButton(route, navigator, index, navState) { 
     }, 
     RightButton(route, navigator, index, navState) { 
     },    
     Title(route, navigator, index, navState) { 
     },   
    })  

    render() { 
     return (
      <View> 
       <Navigator 
       initialRoute={{ 
       name: 'Main', 
       index: 0, 
       }} 
       renderScene={this.renderScene.bind(this)} 
       sceneStyle={{marginTop:50}} 
       navigationBar={ 
        <Navigator.NavigationBar 
        routeMapper={MyApp.NavigationBarRouteMapper(this.props)} 
        /> 
       } 
       ref="nav" /> 
      </View> 
     ); 
} 
+0

、@gre、ありがとうございました。出来た。 ES6の構文をもっと学ぶべきだったと思う。 –

関連する問題