我有一个自定义导航抽屉,在特定的屏幕上,我不希望它可用。
这是我的简短代码。
此导航器也包含在开关导航器中。我已经深入git-hub和其他论坛,目前没有任何工作。我错过了什么吗?是否有人让它工作?
const UserNavigation = createDrawerNavigator({
ProductListScreen: {screen: ProductListScreen},
ProductHistoryScreen: {
screen: ProductHistoryScreen,
navigationOptions: {
drawerLockMode: 'locked-closed'
}
}
}, {
initialRouteName: 'ProductListScreen',
contentComponent: CustomDrawerContentComponent,
})
export default createAppContainer(UserNavigation)
还有一个working code on expo但我尝试并导致双导航器显示,并且在屏幕中我不想显示它出现的抽屉。这是我参考世博会代码的尝试
const UserStackNavigation = createStackNavigator({
ProductListScreen: {screen: ProductListScreen},
ProductHistoryScreen: {
screen: ProductHistoryScreen
}
})
const UserNavigation = createDrawerNavigator({
UserStackNavigation: UserStackNavigation
}, {
initialRouteName: 'UserStackNavigation',
contentComponent: CustomDrawerContentComponent,
})
UserStackNavigation.navigationOptions = ({ navigation }) => ({
drawerLockMode: navigation.state.index === 0 ? 'unlocked' : 'locked-closed',
});
export default createAppContainer(UserNavigation)
问题是我使用Ignite生成我的项目模板,反应导航版本固定为3.0.0。在看了this link的最后一条评论之后,我意识到我的语法没有任何问题。
所以我在package.json中删除了packed.lock.json,yarn.lock,node_modules文件夹。我将版本设置为^ 3.0.0以获取最新版本。
毕竟,我做了一个纱线安装,以获得完整的软件包更新。通过这个更改,我的react-navigation-drawer从1.0.1变为1.3.0,这解决了这个问题。
还对我的导航进行了一些更改,现在看起来像这样:
export default class UserNavigation extends React.Component{
render(){
return <Nav />
}
}
const Nav = createAppContainer(
createDrawerNavigator(
{
ProductListScreen: {screen: ProductListScreen},
ProductHistoryScreen: {
screen: ProductHistoryScreen,
navigationOptions:{
drawerLockMode: 'locked-closed'
}
}
}, {
initialRouteName: 'ProductListScreen',
contentComponent: CustomDrawerContentComponent,
}
)
)