如何解决在抽屉导航中隐藏屏幕 - React Native
所以我试图从导航抽屉中删除一个项目,如果它在那里但不显示也没关系,也不应该可以点击。
<Drawer.Screen name="DetailsScreen" component={DetailsScreen}
options={{
drawerLabel: () => null,title: null,}}/>
我上面的这段代码在一定程度上可以工作,因为我希望它是不可点击的,并且如果有任何意义的话,当人们从详细信息屏幕访问菜单时,还删除它的突出显示。任何帮助表示赞赏..
请注意,我的所有屏幕都在 app.js 文件中,因此我没有任何其他组件。
解决方法
如果你有一些道具,你可以做一个条件......比如:
{state.props == 'something-true' ?
(<Drawer.Screen name="DetailsScreen" component={DetailsScreen}
options={{
drawerLabel: () => null,title: null,}}/>) :
null}
,
您需要制作自定义抽屉,然后为这样的隐藏标签放置条件。
let hiddenTabs =[] <- from redux; // so you can change dynamically
navigation.state.routes.map((route,index) => {
const focused = activeItemKey === route.key;
const scene = { route,index,focused };
const label = getLabel(scene);
return (
!hiddenTabs.includes(label) &&
<TouchableOpacity key={index.toString()} onPress={() => navigation.navigate(label)}>
<Text>{label}</Text>
</TouchableOpacity>
);
})
不需要在路由器中隐藏屏幕。因为您可以激活这些屏幕更改 hiddenTabs 列表。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。