2016-03-24 13 views
0

Ich versuche derzeit, das Verhalten der rechten Navigationsschaltfläche aus meiner Sicht namens "AppointmentBookingView" zu überschreiben. Ich bin total verwirrt darüber, wie der Navigator und die Navigationsleiste zusammenarbeiten, so dass sie nicht in der Lage waren, die Lösung zu finden. Kann jemand klären, ob das überhaupt möglich ist?Wie ändere ich die Schaltflächen der Navigationsleiste in einer Ansicht?

Ich verwende React Native Gifted Forms.

myapp.ios.js:

static NavbarRouteMapper = { 
    LeftButton(route, navigator, index, navState) { 
     if (index === 0) { 
      return null; 
     } 
     var previousRoute = navState.routeStack[index - 1]; 
     return (
      <TouchableOpacity 
       onPress={() => navigator.pop()} 
       style={styles.navBarLeftButton}> 
       <Text style={[styles.navBarText, styles.navBarButtonText]}> 
        Back 
       </Text> 
      </TouchableOpacity> 
     ); 
    }, 

    RightButton(route, navigator, index, navState) { 

    }, 

    Title(route, navigator, index, navState) { 
     return (
      <Text style={[styles.navBarText, styles.navBarTitleText]}> 
       {route.name || 'MyApp'} 
      </Text> 
     ); 
    } 
}; 

render(){ 
    return (
     <Navigator 
      style={styles.appContainer} 
      configureScene={this.configureScene} 
      initialRoute={{name: 'MyApp', component: BookAppointmentView }} 
      navigationBar={ 
       <Navigator.NavigationBar 
        style={styles.navBar} 
        routeMapper={MyApp.NavbarRouteMapper} 
       /> 
      } 
      renderScene={this.renderScene.bind(this)} 
     /> 

    ); 
} 

Hier, wo ich das Verhalten

AppointmentBookingView.js

<GiftedForm 
    formName='bookingForm' // GiftedForm instances that use the same name will also share the same states 

    openModal={(route) => { 
     route.giftedForm = true; 
     this.props.navigator.push(route); 
    }} 
> 
</GiftedForm> 

Antwort

1

Was Sie tun etwas könnte außer Kraft setzen möchte, ist so:

... 

RightButton(route, navigator, index, navState) { 
    if (route.name === 'AppointmentBookingView') { 
     // Here put the button you want and whatever you want it to do 
    } 
}, 

... 

Meine Antwort ist es ein bisschen spät, aber ich hoffe, es hilft

Verwandte Themen