NativeBase 抽屉滑动不工作

Question

谁能告诉我这段代码有什么问题吗？当我运行模拟器时它运行很好但是当我滑动以显示内容时它没有显示。抽屉坏了。我做错了什么？

import React, { Component } from 'react';
import { Drawer } from 'native-base';
import { Navigator, View } from 'react-native';

export default class DrawerExample extends Component {

constructor(props) {
super(props);
this.state = {
toggled: false,
store: {},
theme: null
};
}

toggleDrawer() {
this.state.toggled ? this._drawer.close() : this._drawer.open();
}

openDrawer() {
this.setState({toggled: true});
}

closeDrawer() {
this.setState({toggled: false});
}

renderScene(route, navigator) {
switch(route) {
  default: return null;
}
}
configureScene(route, routeStack) {
return Navigator.SceneConfigs.PushFromRight;
}
render() {
return (
    <Drawer
      ref={(ref) => this._drawer = ref}
      type='displace'
      content={<View style={{backgroundColor: '#000', height: 1000}} />}
      onClose={this.closeDrawer.bind(this)}
      onOpen={this.openDrawer.bind(this)}
      openDrawerOffset={100}
      >
        <Navigator
          ref={(ref) => this._navigator =  ref}
          configureScene={this.configureScene.bind(this)}
          renderScene={this.renderScene.bind(this)}
        />
      </Drawer>
      );
      }
      }

Answer 1

您可以使用 panOpenMask={<value>} 实现此目的。我用 .25.

的值测试了它

API 说：

panOpenMask (Number) null - Ratio of screen width that is valid for the start of a pan open action. If null -> defaults to max(.05, closedDrawerOffset)

编辑：

我的完整代码（在我自己的项目中）是：

<Drawer
   ref={(ref) => { this._drawer = ref; }}
   content={ navigationView }
   side="right"
   panOpenMask={.25}
>

NativeBase 抽屉滑动不工作

NativeBase Drawer swipe not working

reactjs

react-native

native-base