Wie kann ich Refs in eine Variable von NavigationBar routeMapper (Reactive Native) übergeben?

Question

Nach der AKTUALISIERT Code - Ich versuche, ich bestanden zu implementieren reagieren-native-Schublade aus https://github.com/root-two/react-native-drawer und die Variable in NavigationBarRouteMapper protokolliert openDrawer() Funktion richtig, aber wenn die linke Navigationstaste geklickt wird es tut nichts:

class practice extends Component { 
... 

    openDrawer(){ 
    this._drawer.open() 
    } 

    render() { 
    return (
    <Drawer 
    content={<DrawerPanel/>} 
    openDrawerOffset={100} 
    ref={(ref) => this._drawer = ref} 
    type='static' 
    tweenHandler={Drawer.tweenPresets.parallax} 
    > 
     <Navigator 
      configureScene={this.configureScene} 
      initialRoute={{name: 'Start', component: Start}} 
      renderScene={this.renderScene} 
      style={styles.container} 
      navigationBar={ 
      <Navigator.NavigationBar 
       style={styles.navBar} 
       routeMapper={NavigationBarRouteMapper(this.openDrawer)} 
      /> 
      } 
     /> 
    </Drawer> 
    ); 
    } 
} 

var NavigationBarRouteMapper = openDrawer => ({ 
    LeftButton(route, navigator, index, navState){ 
     return(
      <TouchableHighlight onPress={()=>{openDrawer}}> 
       <Text>Open Menu</Text> 
      </TouchableHighlight> 
    ) 
    } 
    },... 

Was könnte das Öffnen der Schublade verhindern? Scheint so, als wäre alles richtig implementiert worden.

Answer 1

Ihr Problem ist mit dem Umfang der testingString Variable. Wenn Sie console.log(this.testingString) zeigen, zeigt this auf das Objekt, das von der NavigationBarRouteMapper-Funktion zurückgegeben wird. Sie haben für dieses Objekt keine testingString Variable festgelegt, daher wird es undefined zurückgegeben.

Um die Variable zu erhalten, die Sie auf diese Weise an die Funktion übergeben haben, verwenden Sie einfach testingString und nicht this.testingString.

bearbeiten über die openDrawer Funktion

Sie eine Funktion übergeben, dass kehrt Ihre openDrawer Funktion, anstatt sie zu rufen. Sie werden onPress={openDrawer} oder onPress={() => openDrawer()} als Ihre Requisite übergeben wollen.