重置主屏幕的导航堆栈(响应导航并响应本机)
重置主屏幕的导航堆栈(响应导航并响应本机)
提问于 2017-03-29 10:24:26
我在反应导航的导航中遇到了问题，并对本机做出了反应。它是关于重置导航和返回到主屏幕。
我已经在一个StackNavigator中构建了一个DrawerNavigator，主屏幕和其他屏幕之间的导航工作正常。但问题是，导航堆栈不断增长。我不知道如何从堆栈中移除屏幕。
例如，当从主屏幕转到设置屏幕，然后进入屏幕，最后再到主屏幕时，主屏幕在堆栈中是两次。使用后退按钮，我不会离开应用程序，但再次进入屏幕。
当再次选择主按钮时，堆栈的重置将是很棒的，但我不知道该如何做。这里有人试图帮助另一个有类似问题的人，但这个解决方案对我无效。
const Stack = StackNavigator({
Home: {
screen: Home
},
Entry: {
screen: Entry
},
Settings: {
screen: Settings
}
})
export const Drawer = DrawerNavigator({
Home: {
screen: Stack
}},
{
contentComponent: HamburgerMenu
}
)这是抽屉屏幕的一个简单例子
export default class HamburgerMenu extends Component {
render () {
return <ScrollView>
<Icon.Button
name={'home'}
borderRadius={0}
size={25}
onPress={() => { this.props.navigation.navigate('Home')}}>
<Text>{I18n.t('home')}</Text>
</Icon.Button>
<Icon.Button
name={'settings'}
borderRadius={0}
size={25}
onPress={() => { this.props.navigation.navigate('Settings')}}>
<Text>{I18n.t('settings')}</Text>
</Icon.Button>
<Icon.Button
name={'entry'}
borderRadius={0}
size={25}
onPress={() => { this.props.navigation.navigate('Entry')}}>
<Text>{I18n.t('entry')}</Text>
</Icon.Button>
</ScrollView>
}
}我希望你能帮助我。这是导航的一个重要部分，解决方案将是伟大的！
回答 15
Stack Overflow用户
回答已采纳
发布于 2017-03-30 14:49:05
我就是这样做的：
reset(){
return this.props
.navigation
.dispatch(NavigationActions.reset(
{
index: 0,
actions: [
NavigationActions.navigate({ routeName: 'Menu'})
]
}));
}至少将“菜单”改为“主页”。您还可能希望使this.props.navigation适应您的实现。
在版本>2中，如下所示：
import { NavigationActions, StackActions } from 'react-navigation';
const resetAction = StackActions.reset({
index: 0,
actions: [NavigationActions.navigate({ routeName: 'MainActivity' })],
});
this.props.navigation.dispatch(resetAction); Stack Overflow用户
发布于 2020-02-12 14:39:34
反应导航5.x，6.x
import { CommonActions } from '@react-navigation/native';
navigation.dispatch(
CommonActions.reset({
index: 1,
routes: [
{ name: 'Home' },
{
name: 'Profile',
params: { user: 'jane' },
},
],
})
);可在小吃中获得
Stack Overflow用户
发布于 2020-06-20 13:13:40
我在使用@react-navigation Bashirpour的回答时发现了这种方法。然而，当您在props中已经有导航的功能组件时，这里是编写reset Stack操作的一种很好的方法：
props.navigation.reset({
index: 0,
routes: [{ name: 'Dashboard' }]
})页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/43090884
复制相关文章
相似问题
腾讯云开发者
