如何关闭嵌套导航器中先前打开的屏幕，然后在不进行任何更改的情况下重新打开它

Question

我有以下导航器结构

• 选项卡导航器
  • 选项卡1
    • StackNavigator
      • 屏幕A
      • 屏幕B
  • 选项卡2
    • StackNavigator
      • 屏幕C
      • 屏幕D
  • 选项卡3
    • StackNavigator
      • 屏幕E
      • 屏幕F

屏幕 E 上有一个表单，根据传递到此屏幕的路由参数，显示或隐藏某些输入。

当我转到 ScreenA，并从该屏幕使用参数 x 导航到 ScreenE，然后通过单击选项卡转到屏幕 C，并使用参数 y 导航到 ScreenE 时，我希望关闭 ScreenE，并使用基于清除的表单再次重新打开参数 y。这可能吗？

Answer 1

就我而言，我编写了一个解决方案，使用新参数重置目标路线。然而，取决于你的逻辑，也许你可以重新初始化屏幕 E 的状态

//reset screen that is going to navigate to (screen is existed in stack)
//"@react-navigation/native": "^6.1.9",
export function navigateReset(navigation, screenName, newParams) {
  navigation.dispatch(state => {
    // find target route
    const routes = [...state.routes];
    const index = routes.findIndex(r => r.name === screenName);
    if (index > -1) {
      // remove target route and after routes
      routes.splice(index);

      return CommonActions.reset({
        ...state,
        routes: [
          ...routes,
          {
            ...state.routes[index],
            key: state.routes[index].key + '1',
            params: newParams,
          },
        ],
        index: routes.length,
      });
    } else {
      // if not found just navigate
      return CommonActions.navigate({name: screenName, params: newParams});
    }
  });
}