react-native - react 导航导航()功能不起作用

Question

我正在使用 React Native 和 构建一个应用程序 react 导航 图书馆。
重现问题的步骤
所以使用 React Navigation 5，我构建了一个包含两个屏幕的堆栈导航器，如下所示:

const Stack = createStackNavigator();
const Nav = () => {
  <Stack.Navigator
    <Stack.Screen
        name="A"
        component={A}
    />
    <Stack.Screen
        name="B"
        component={B}
    />
  </Stack.Navigator>
}

视屏 一个 是导航器中的第一个，它将是第一个在屏幕上显示和呈现的。现在我想立即导航到 乙 尽快 一个 已经渲染，所以我在 中写了以下代码一个 :

useEffect(()=>{
    navigation.navigate('B');
}, [navigation]);

问题
问题是屏幕一直卡在 一个 并且不会导航到 乙
可能的原因
我认为当屏幕 一个 试图执行其 useEffect代码，屏幕 乙 仍然没有加载到导航器的 DOM 中。因为当我实际上试图延迟执行 useEffect 时像这样 2 秒:

useEffect(()=>{
    setTimeout(()=>{
        navigation.navigate('B');
    }, 2000)
}, [navigation]);

它起作用了，屏幕从 导航一个 至 乙 !所以我想 乙 有时间在不到 2 秒的时间内加载到 DOM 中吗？
任何解决方案？
所以，如果我的假设是正确的，我想知道是否有一种正式的方法来检查屏幕 乙 已被有效加载到导航器的 DOM 中，或者可能等待导航器呈现后再执行 useEffect在 一个 .也许有一个特殊的 react 钩子(Hook)或库来检查这种情况？
如果我错了，请帮助我!

Answer 1

我认为导航不起作用，因为您没有像这样将堆栈屏幕包装到堆栈导航器中:

<Stack.Navigator>
    <Stack.Screen
        name="A"
        component={A}
    />
    <Stack.Screen
        name="B"
        component={B}
    />
</Stack.Navigator>

这显示在 navigation docs 中