ReactNative抽屉:空白屏幕

时间:2017-04-17 08:42:38

标签: react-native drawer native-base

我正在尝试在我的React Native应用程序中使用React-Native-Drawer(但NativeBase抽屉出现同样的问题),但屏幕上没有任何显示:既不是抽屉,也不是主要内容。但是,如果我记录抽屉组件的jsx标签,它既不是null也不是未定义。

这里是相关的片段:

render(){

    const mainZone = <Text>Hello drawer !</Text>
    const sideBar = <Text>My drawer item</Text>

    const drawerZone = <Drawer
                        ref={(ref) => { this.drawer = ref; }}
                        content={sideBar}
                        onClose={() => this.closeDrawer()}
                        tapToClose
                      >
                      {mainZone}
                      </Drawer>;

    return drawerZone;
}

这里的版本

$ react-native --version
react-native-cli: 2.0.1
react-native: 0.43.3

的package.json

{
  "name": "custom-app",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "android": "curl 'http://localhost:8081/index.android.bundle?platform=android' -o 'android/app/src/main/assets/index.android.bundle' && node node_modules/react-native/local-cli/cli.js run-android",
    "test": "jest"
  },
  "dependencies": {
    "chess-lib-js": "0.0.5",
    "native-base": "^2.1.1",
    "react": "16.0.0-alpha.6",
    "react-native": "0.43.3",
    "react-native-fetch-blob": "^0.10.4",
    "react-native-splash-screen": "^2.0.0",
    "react-native-svg": "^5.1.7"
  },
  "devDependencies": {
    "babel-jest": "19.0.0",
    "babel-preset-react-native": "1.9.1",
    "jest": "19.0.2",
    "react-test-renderer": "16.0.0-alpha.6"
  },
  "jest": {
    "preset": "react-native"
  }
}

所以我的问题只是以下内容:我是否遗漏了抽屉里的东西,某些设置或属性?我的代码出了什么问题?

1 个答案:

答案 0 :(得分:1)

NativeBase-KitchenSink展示了所有NativeBase组件。

检查Drawer实施