相关疑难解决方法(0)

假设我在StackNavigator应用程序中浏览了4个屏幕,现在我想回到第一个屏幕.似乎有三种不同的方法可以做到这一点,它们会导航到我想要做的地方,但每种方式都有一个循环每个前一个屏幕的动画.

有没有干净的方式从导航SCREEN_D到SCREEN_A？

换句话说,在看到向后导航之前,我不希望看到SCREEN_C和SCREEN_B分裂一秒钟SCREEN_ASCREEN_D

navigation.navigate(SCREEN_A);
...
navigation.navigate(SCREEN_B);
...
navigation.navigate(SCREEN_C);
...
navigation.navigate(SCREEN_D);

三种方法:

1.

return this.props.navigation
               .dispatch(NavigationActions.reset(
                 {
                    index: 0,
                    actions: [NavigationActions.navigate({ routeName: 'SCREEN_A'})]
                  }));

2.

 const {SCREEN_B_KEY} = this.props.navigation.state.params
 this.props.navigation.goBack(SCREEN_B_KEY)

3.

const defaultGetStateForAction = Navigation.router.getStateForAction;

Navigation.router.getStateForAction = (action, state) =>{
  if(action.type === "Navigation/BACK"){
    const routes = [
      {routeName: 'First'},
    ];
    return {
      ...state,
      routes,
      index: 0,
    };
  }
  return defaultGetStateForAction (action,state);
}

所以，我有以下屏幕：

- ChatList
- NewRoom
- ChatRoom

基本上，我不想Start a new chat从刚刚创建的聊天室返回……而是直接进入聊天室列表。到目前为止，我想出了以下几点：

const prevGetStateForActionChatStack = ChatStack.router.getStateForAction

ChatStack.router.getStateForAction = (action, state) => {
    if (state && action.type === 'RemovePreviousScreen') {
        const routes = state.routes.slice( 0, state.routes.length - 2 ).concat( state.routes.slice( -1 ) )
        return {
            ...state,
            routes,
            index: routes.length - 1
        }
    }
    return prevGetStateForActionChatStack(action, state)
}

并且它理论上是有效的……但是在到达新房间后删除之前的路线时出现了一个奇怪的动画，如下所示。如果你们有任何解决这个问题的方法，请告诉我......

假设 Tab Navigator 中有两个堆栈屏幕：

1. 选项卡 A -> 相机
2. 选项卡 B -> 个人资料

在配置文件屏幕中，在其堆栈中推送了其他相同类型（“配置文件”）（具有不同参数）的屏幕。现在，如果您在“相机”屏幕中并执行以下操作：

    navigation.navigate("Profile", { screen: "Profile", params });

您将导航到“配置文件”屏幕，这些参数将被发送到堆栈中的最后一个屏幕。如果我想导航到传递参数的堆栈的根，我该怎么办？

我试过：

   // In the profile screen
   useEffect(() => {
       if (navigation.canGoBack())
            navigation.popToTop(); // Go back to the root of the stack

       showParams(params);
   }, [params])

但是有了这个，“showParams”操作不在根目录中执行，我也没有从“相机”屏幕直接导航到堆栈的根目录。

我想我必须在导航之前在“相机”屏幕中执行以下操作：

  navigation.dispatch(
        CommonActions.reset({
          // some stuff
        })
  );

  navigation.navigate("Profile", { screen: "Profile", params });

但是我找不到任何方法来实现我的目标。

有任何想法吗？谢谢你。

更新 - 我的导航系统

堆栈（这里我定义了多个堆栈：“HomeStacks”、“SearchStacks”、“ProfileStacks”...）

const Stack = createStackNavigator();

export function ProfileStacks() { <------ Over this stack I do .push() …

我遇到了一个错误。当我尝试重置屏幕导航堆栈时，出现此错误The action 'Navigation/RESET' was not handled by any navigation

我重置导航的代码是：

 let resetAction = StackActions.reset({
       key: null,
       index: 0,
       actions: [
         NavigationActions.navigate({ routeName: 'ScreenName' })
       ]
    })
 this.props.navigation.dispatch(resetAction)

如果您能建议我任何解决方案，我将非常感激。