Question

const ListNavigator = createStackNavigator({
  List: {
    screen: PostListContainer,
    path: 'list',
  },
});


const leftMenuWidth = Dimensions.get('screen').width / 2;

const DrawerNavigator = createDrawerNavigator({
  Home: AppNavigator,
  PostType1: ListNavigator,
  PostType2: ListNavigator,
}, {
  drawerWidth: leftMenuWidth,
  contentComponent: SlideMenuContainer,
  drawerOpenRoute: 'DrawerOpen',
  drawerCloseRoute: 'DrawerClose',
  drawerToggleRoute: 'DrawerToggle',
});

SlideMenuContainer

class SideMenuContainer extends Component {
  navigateToScreen = route => () => {
    const { navigation } = this.props;
    const navigateAction = NavigationActions.navigate({
      routeName: route,
    });
    navigation.dispatch(navigateAction);
  }

  render() {
    const { props } = this;
    return (
      <Container>
        <SafeAreaView>
          <Header>
            <Body style={{ flex: 1 }}>
              <Icon named="a" />
            </Body>
            <Content style={{ flex: 1, height: 800 }}>
              <DrawerItems {...props} />
            </Content>
          </Header>
        </SafeAreaView>
      </Container>
    );
  }
}

在“抽屉导航”中触摸PostType1时我想将{Type: 1}传递给ListNavigator。

<ListNavigator {... props} Type = 1 />

我看过这样的代码，但是我不知道在哪里使用它。怎么样单击“抽屉导航”菜单时可以发送参数吗？

Answer 1

您可以在抽屉式导航中导航到另一个屏幕时添加道具

 this.props.navigation.navigate("route", {
     type: 1
 });

ReactNative如何在自定义抽屉导航中传递参数

1 个答案: