注册流程完成后自动跳转至首页而非好友页的问题求助

大家好，我现在在做React Native应用的注册流程，流程设计是：Landing page → 注册 → ChooseAvatar → Friend → Home。这里的核心逻辑是：用户在ChooseAvatar页面点击继续按钮时，会完成数据库注册并自动登录，而Friend页面仅对登录用户开放，但需要区分用户是「注册流程中进入」还是「正常使用时进入」——所以我在AuthContext里加了个inRegistrationFlow状态，进入注册流程时设为true，等用户在Friend页点击跳转Home的按钮时再设为false。

但现在遇到了棘手的问题：用户一完成注册（也就是在ChooseAvatar点下继续按钮后），就直接自动跳转到Home页了，根本没经过Friend页，完全不符合预期流程。

先给大家看下我的导航结构代码：

return (
  <NavigationContainer>
    <Stack.Navigator>
      {isLoggedIn ? (
        <Stack.Group>
          <Stack.Screen name="Navbar" component={Navbar} options={{headerShown: false}} />
          <Stack.Screen name="Restaurant" component={Restaurant} options={{headerShown: false}} />
          <Stack.Screen name="Review" component={Review} options={{headerShown: false}} />
        </Stack.Group>
      ) : (
        <Stack.Group>
          <Stack.Screen name="LandingPage" component={LandingPage} options={{ headerShown: false }}/>
          <Stack.Screen name="Register" component={Register} options={{ header: () => <Header /> }}/>
          <Stack.Screen name="ChooseAvatar" component={ChooseAvatar} options={{ header: () => <Header /> }}/>
          <Stack.Screen name="Friend" component={Friend} options={{ header: () => <Header /> }}/>
          <Stack.Screen name="Login" component={Login} options={{ header: () => <Header />  }}/>
        </Stack.Group>
      )}
    </Stack.Navigator>
  </NavigationContainer>
);

还有包含Friend页的Tab导航组件（Navbar里的代码）：

<Tab.Navigator
  screenOptions={{
    tabBarActiveTintColor: '#739072',
    tabBarStyle: { display: keyboardVisible ? 'none' : 'flex', height: 50, backgroundColor: '#F5F5F5', borderTopWidth: 1, borderTopColor: 'gray' },
  }}
>
  <Tab.Screen name="GlobalStack" component={GlobalStack} options={{ tabBarButton: () => null, headerShown: false }} />
  <Tab.Screen
    name="Home"
    component={Home}
    options={{
      tabBarIcon: ({color, size}) => (
        <Icon name="home" color={color} size={size}/>
      ),
      tabBarLabel: () => null,
      headerShown: false,
      headerTitle: ''
    }}
  />
  <Tab.Screen
    name="Friend"
    component={Friend}
    options={{
      tabBarIcon: ({color, size}) => (
        <AntDesign name="addusergroup" color={color} size={size}/>
      ),
      tabBarLabel: () => null,
      headerShown: inRegistrationFlow,
      header: inRegistrationFlow ? () => <Header /> : undefined
    }}
  />
  <Tab.Screen
    name="SearchRestaurant"
    component={SearchRestaurant}
    options={{
      tabBarIcon: ({color, size}) => (
        <Material name="restaurant-outline" color={color} size={size}/>
      ),
      tabBarLabel: () => null,
      headerShown: false
    }}
  />
</Tab.Navigator>

我已经尝试了两种方法，但都没解决问题：

方法一：在注册完成的回调里手动导航到Friend页 #

我在ChooseAvatar的handleCompleteRegistration函数里，把导航到Friend的方法作为回调传给registerUser，想着注册完成后先执行导航再结束加载：

const handleCompleteRegistration = async () => {
  const navigateToFriend = () => {
    navigation.navigate("Friend");
  };

  if (!selectedAvatar) {
    alert("Please select an avatar");
    setLoading(false);
    return;
  }
  setLoading(true);
  const completedUserDetails = {
    ...formData,
    profile_picture: selectedAvatar,
  };

  try {
    console.log("Completed user details:", completedUserDetails);
    await registerUser(completedUserDetails, navigateToFriend);
  } catch (error) {
    console.error("Error completing registration:", error);
  } finally {
    setLoading(false);
  }
};

但没用，还是直接跳转到Home页。

方法二：用useEffect监听登录状态变化来导航 #

我加了个useEffect，当isLoggedIn变为true且是新用户时，自动导航到Friend页：

useEffect(() => {
  const navigateIfReady = async () => {
    const isNewUser = await AsyncStorage.getItem("isNewUser");
    if (isNewUser === "true" && isLoggedIn) {
      navigation.navigate("Friend");
      console.log("Navigating to Friend screen")
      await AsyncStorage.removeItem("isNewUser");
    }
  };
  navigateIfReady();
}, [isLoggedIn, navigation, route.params]);

结果还是一样，注册完直接跳Home，完全没触发这个导航逻辑似的。

有没有大佬能帮我分析下问题出在哪？为什么注册后会自动跳Home？该怎么改才能让新用户注册完先进入Friend页，再由用户主动操作跳转到Home？

备注：内容来源于stack exchange，提问作者John Clapper