如何在 React Native 中重置嵌套导航器中的导航堆栈状态

How to reset navigation stack state in nested navigator in react native

我的代码类似于下面的代码。假设当前我的导航堆栈历史是:

画面A>画面B>画面D

从屏幕 D 按下按钮我想重置我的导航堆栈 state/history 如下所示:屏幕 A> 屏幕 F

但是我收到这个错误:

  The action 'RESET' with payload {"index":1,"routes":[{"name":"Screen A"},{"name":"Screen F"}]} was not handled by any navigator.
<Stack.Navigator>
  <Stack.Screen name="TabNavigator" component={TabNavigator} />
  <Stack.Screen name="Screen E" component={ScreenE} />
  <Stack.Screen name="Screen F" component={ScreenF} />
  <Stack.Screen name="Screen G" component={ScreenG} />
</Stack.Navigator>
<Tab.Navigator>
  <Tab.Screen name="Screen A" component={ScreenA} />
  <Tab.Screen name="Screen B" component={ScreenB} />
  <Tab.Screen name="Screen C" component={ScreenC} />
  <Tab.Screen name="Screen D" component={ScreenC} />
</Tab.Navigator>

const ScreenD=({navigation})=>{ <Button title="reset stack" onPress={()=> navigation.reset({
        index: 1,
         routes: [{ name: "Screen A" }, { name: "Screen F" }],
       })} /> }

从这里使用 CommonActions.reset() https://reactnavigation.org/docs/navigation-actions

效果很好。