DrawerNavigator打开配置的第一个屏幕而不是菜单(react-navigation v1)

时间:2018-06-15 12:50:47

标签: react-native react-navigation

我的应用程序中有一个自定义标题,其中有一个用于打开DrawerNavigator的设置按钮,当我按下此按钮时我想显示带有选项的菜单但是当我按下此按钮时总是打开在DrawerNavigator中配置的第一个屏幕而不打开只有菜单。我不知道是否需要配置别的东西。

设定:

react-navigation:1.5.2

模拟器iOS

代码:

Navigation.js

import { TabNavigator, StackNavigator, DrawerNavigator } from 'react-navigation';
import { TermsAndConditionsPage, NoticePrivacyPage, HomePage } from '../pages';


const DrawerStack = DrawerNavigator({
  screen1: {
    screen: TermsAndConditionsPage,
    navigationOptions: {
      drawerLabel: 'Terms and Contiditons',
    },
  },
  screen2: {
    screen: NoticePrivacyPage,
    navigationOptions: {
      drawerLabel: 'Notice of Privacy',
    },
  },
}, {
  drawerPosition: 'right',
});

const HomeStack = StackNavigator({
  HomeView: {
    screen: HomePage,
    navigationOptions: {
      header: (<Header screen="home" /* headerPropsStyle={styles.headerHomeTab} */ />),
    },
  },
  DrawerMenu: {
    screen: DrawerStack,
    navigationOptions: {
      header: null,
    },
}, {
  initialRouteName: 'HomeView',
});

HeaderHome.js

...
  render() {
    // console.log('indexCity', indexCity);

    return (
      <Grid style={styles.gridStyle}>
        <Col style={{ backgroundColor: 'transparent', paddingTop: platform === 'ios' ? 5 : 10 }}>
          <ModalPicker
            style={{ paddingLeft: 20, backgroundColor: 'transparent', marginTop: platform === 'ios' ? 0 : -6, maxWidth: 600 }}
            selectTextStyle={{ fontSize: 15, color: 'white', fontWeight: 'bold', marginTop: -10, textAlign: 'left' }}
            selectStyle={{ borderWidth: 0, borderColor: null }}
            data={this.state.cities}
            initValue="Location"
            cancelText="Cancel"
            onChange={(option) => { this.selectCity(option.id, option.name); }}
          />
        </Col>

        <Col style={{ backgroundColor: 'transparent', width: 40, paddingTop: platform === 'ios' ? 5 : 10 }}>
          <TouchableOpacity
            onPress={() => this.props.navigation.navigate('DrawerOpen')}
            style={{ marginTop: platform === 'ios' ? -5 : -10, backgroundColor: 'transparent' }}
          >
            <Icon
              name="ios-settings-outline"
              style={{ color: 'white', fontSize: 28, alignSelf: platform === 'ios' ? 'center' : 'auto' }}
            />
          </TouchableOpacity>
        </Col>
      </Grid>
    );
  }
}

0 个答案:

没有答案