如何将refs传递给NavigationBar routeMapper(React Native)的变量?

时间:2016-07-20 19:42:23

标签: javascript ios react-native react-jsx

以下是UPDATED代码 - 我正在尝试从https://github.com/root-two/react-native-drawer实现react-native-drawer,并且我传递给NavigationBarRouteMapper的变量正确记录openDrawer()函数,但是当单击左导航按钮时它没什么:

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>
      )
    }
  },...

什么可能阻止抽屉打开?好像一切都已正确实施。

1 个答案:

答案 0 :(得分:0)

您的问题与console.log(this.testingString)变量的范围有关。当您this时,NavigationBarRouteMapper指向testingString函数返回的对象。您尚未在此对象上设置testingString变量,因此它将返回undefined。

要获得以这种方式传递给函数的变量,只需使用this.testingString,而不是openDrawer

关于openDrawer函数的编辑

您正在传递返回您的onPress={openDrawer}函数的函数,而不是调用它。您需要将onPress={() => openDrawer()}mViewPager.setAdapter(mCustomPagerAdapter); mViewPager.setCurrentItem(position); 作为道具。