React Native DrawerLayoutAndroid ref无效

时间:2016-05-09 15:02:57

标签: android reactjs react-native drawerlayout

这是我到目前为止所拥有的

  <DrawerLayoutAndroid
    ref={'drawer'}
    drawerWidth={300}
    drawerPosition={DrawerLayoutAndroid.positions.Left}
    renderNavigationView={() => {
      return navigationView;
    }}>
      <Navigator
        ref={'navigator'}
        initialRoute={initialRoute}
        navigationBar={
          <Navigator.NavigationBar
            routeMapper={NavigationBarRouteMapper}
            style={{ backgroundColor: '#68758E', height: 50 }}
            />
        }
        configureScene={(route, routeStack) => {
          return Navigator.SceneConfigs.HorizontalSwipeJump;
        }}
        renderScene={(route, navigator) => {
          console.log(this, this.refs);
          if (this.refs.appDrawer) {
            console.log(this.refs.appDrawer);
          }
          if (self.backButtonEventAdded === false) {
            BackAndroid.addEventListener('hardwareBackPress', function() {
              if (navigator && navigator.getCurrentRoutes().length > 1) {
                  navigator.pop();
                  return true;
              }
              return false;
            });
            self.backButtonEventAdded === true;
          }
          if (route.id == 0) {
            return (
              <HomePage navigator={navigator} />
            );
          }
          if (route.id == 1) {
            return (
              <RingtonePage ringtone={route.ringtone} />
            );
          }
        }}
        />
  </DrawerLayoutAndroid>

现在,在导航器的renderScene方法中,第一行记录thisthis.refs console.log(this, this.refs) 当我在chrome中检查this时,它上面设置了正确的引用,但第二个this.refs是空对象。这是为什么 ? https://github.com/aivarsk/scrapy-proxies

1 个答案:

答案 0 :(得分:1)

我不明白你的问题究竟是什么......准确的错误信息是什么?

这是一个很好的DrawerLayoutAndroid的例子......

<DrawerLayoutAndroid drawerWidth={300} ref={'drawer'} navigator={Navigator.SceneConfigs.HorizontalSwipeJump} drawerPosition={DrawerLayoutAndroid.positions.Right} renderNavigationView={() => navigationView}> <Navigator film={this.props.film} configureScene={(route) => { transition = Navigator.SceneConfigs.HorizontalSwipeJump transition.gestures = null}} navigator={this.props.navigator} initialRoute={{onRightButton: (() => this._openDrawer())}} navigationBar={ <Navigator.NavigationBar style={{backgroundColor: '#246dd5'}} routeMapper={NavigationBarRouteMapper} /> } renderScene={() =>this.renderScene(this.props.film)} /> </DrawerLayoutAndroid>

这是打开它的功能:

_openDrawer:function() { this.refs['drawer'].openDrawer(); },

希望这会对你有帮助:)!