如何在反应原生导航 Wix V2 中从侧边菜单导航到页面
Posted
技术标签:
【中文标题】如何在反应原生导航 Wix V2 中从侧边菜单导航到页面【英文标题】:How navigate to a page from side menu in react native navigation Wix V2 【发布时间】:2019-02-07 16:35:56 【问题描述】:我是 React Native 的新手。我想从侧面菜单导航到屏幕。我使用了 react-native-navigation Wix V2 库。如果有人能帮我举一个简单的例子,我将不胜感激。
【问题讨论】:
【参考方案1】:首先你需要为sideMenu的中心栈设置ID。例如:
Navigation.events().registerAppLaunchedListener(() =>
Navigation.setRoot(
root:
sideMenu:
right:
component:
name: 'SideMenu',
,
,
center:
stack:
id: 'STACK_ROOT_ID',
children: [
component:
name: 'Login',
,
,
],
,
,
,
,
);
然后在您的侧边菜单中,您可以像这样在 onPress 菜单上推送您的注册屏幕。像这样:
Navigation.push('STACK_ROOT_ID',
component:
name: 'REGISTERED_SCREEN_NAME',
options:
sideMenu:
right:
visible: false,
,
,
,
,
);
【讨论】:
【参考方案2】:有一个内置导航供 react native 使用,因为它提供了 react-native 导航(堆栈导航)。因为可以轻松地从侧面菜单进行导航
// 下面是创建侧边菜单的代码。
const RootDrawer = DrawerNavigator(
demo: screen: demo ,
demo2: screen: demo2 ,
,
contentComponent: NavigationDrawer
)
// 下面是侧面菜单视图和提供的用于从屏幕导航的链接。
<TouchableOpacity onPress = () => this.props.navigation.navigate('demo')>
<View style = height: responsiveHeight(8), justifyContent:'center'>
<Text style = fontSize: responsiveFontSize(2), color: 'black', fontFamily: 'Nunito-Regular', paddingLeft: 30 >My Cart</Text>
</View>
</TouchableOpacity>
this.state.customer &&
<TouchableOpacity onPress = () => this.props.navigation.navigate('demo1')>
<View style = height: responsiveHeight(8), justifyContent:'center'>
<Text style = fontSize: responsiveFontSize(2), color: 'black', fontFamily: 'Nunito-Regular', paddingLeft: 30 >Account</Text>
</View>
</TouchableOpacity>
【讨论】:
以上是关于如何在反应原生导航 Wix V2 中从侧边菜单导航到页面的主要内容,如果未能解决你的问题,请参考以下文章
在使用 setRoot 时渲染 flash 或推入反应原生导航