React Native: How to pass props to 'routeMapper' of 'Navigator.NavigationBar'?

Question

I am in trouble with using React Native 0.16 (Android). The question is how to pass props to routeMapper of Navigator.NavigationBar, which belong to <Navigator /> component.

My code structure like below

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>
        );
}

Answer 1

You can generate the mapper object every time using a function, in your code this could just be:

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>
        );
}