react-native:react-navigation

时间:2017-12-30 02:16:58

标签: reactjs react-native react-navigation

我希望在抽屉导航器中的所有选项卡上都有后退按钮(主页除外)。我正在使用react-navigation。

我尝试在反应导航文档中执行此操作...

<TouchableOpacity style={{ //open School instagram
            top: 9,
            left: -99,
        }}
            onPress={() => { () => goBack(null) }}>
            <Image
            style={{

                height: 33,
                width: 33,
                tintColor: '#E1B60B',
            }}
            source={require('../resources/icons/homeb.png')}
            />
        </TouchableOpacity>

然而,即使我之前去过其他屏幕,这对我来说也总是回到主屏幕。 我也有这个组件的一些格式问题。它总是会到达屏幕顶部并留下一个白色条(即使是绝对定位)。

以下是我的抽屉导航器的代码:

export const Root = DrawerNavigator({

  Home: { screen: Home },
  About: { screen: About },
  Administration: { screen: Administration },
  CSF: { screen: CSF },
  Calendar: { screen: Calendar },
  Directory: { screen: Directory },
  HNN: { screen: HNN },
  NHS: {screen: NHS},
  IB: { screen: IB },
  ID: { screen: ID },
  Site: { screen: Site },
  WebStore: { screen: WebStore },


}, {
  // drawer config
  //drawerWidth: 239, //drawer width //auto size for device

  contentComponent: props => <ScrollView><DrawerItems {...props} /></ScrollView>, //scrolling drawer
  //backBehavior: 'none', //currently makes back button do nothing
  drawerPosition: 'right',
  drawerBackgroundColor: 'whitesmoke',
  drawerOpenRoute: 'DrawerOpen', //stuff that prevents errors
  drawerCloseRoute: 'DrawerClose',  //stuff that prevents errors
  drawerToggleRoute: 'DrawerToggle', //stuff that prevents errors
  contentOptions: {
    activeTintColor: '#63461E', //brown active text
    inactiveTintColor: '#7F6D45', //light brown inactive text
    style: {
      marginVertical: 9,

    }
  }
  //end drawer config
});

提前致谢

0 个答案:

没有答案