嵌套在抽屉导航器中的堆栈导航器存在问题

Question

我正在尝试将反应导航从3.x更新到5.x。

当前行为

我在堆栈导航器中有一个身份验证流程，如下所示：

import React, { useState } from 'react';
import { NavigationContainer } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';
import AuthLoaderScreen from '../screens/AuthLoaderScreen';
import HomeNavigation from './navigations/HomeNavigation';
import AuthNavigation from './navigations/AuthNavigation';
import { AuthContext, HomeContext} from '../shared/contexts';

const Stack = createStackNavigator();

const Routes = () => {

  const [isLoading, setIsLoading] = useState(true);
  const [isLoggedIn, setIsLoggedIn] = useState(false);
  const [isNewAccount, setIsNewAccount] = useState(false);
  const [user, setUser] = useState({});



 return (
    <NavigationContainer>
      <AuthContext.Provider value={{
            loaded: () => setIsLoading(false),
            login: () => setIsLoggedIn(true),
            signup: user => {
              setIsNewAccount(true);
              setUser(user);
              setIsLoggedIn(true);
            },
            signout: () => {
              setIsLoggedIn(false);
            }
          }}>
        <HomeContext.Provider value={{
            newAccount: isNewAccount,
            user
          }}>


          <Stack.Navigator
            screenOptions={{
              header: () => null,
            }}>

          {isLoading
          ? (

            <Stack.Screen name="AuthLoaderScreen" component={AuthLoaderScreen} />

          ) : (
            null
          )}

          {!isLoggedIn
          ? (
            <Stack.Screen name="AuthNavigation" component={AuthNavigation} />
          )
          : (
            <Stack.Screen name='HomeNavigation' component={HomeNavigation} />
          )}

      </Stack.Navigator>
    </HomeContext.Provider>
  </AuthContext.Provider>
</NavigationContainer>


 );  
};

export default Routes;

当我在“ HomeNavigation”中时出现问题：

import React from 'react';
import { createDrawerNavigator } from '@react-navigation/drawer';
import HomeStack from '../stacks/HomeStack';
import EditUserStack from '../stacks/EditUserStack';
import MinimumEditUserStack from '../stacks/MinimumEditUserStack';
import UserSignatureStack from '../stacks/UserSignatureStack';
import SignoutScreen from '../../screens/AuthScreens/SignoutScreen';

Drawer = createDrawerNavigator();

const HomeNavigation = () => (
  <Drawer.Navigator
    initialRouteName="Home"
    drawerPosition="left">

    <Drawer.Screen
      name="Home"
      component={HomeStack}
    />

    <Drawer.Screen
      name="EditUserStack"
      component={EditUserStack}
    />

    <Drawer.Screen
      name="MinimumEditUserStack"
      component={MinimumEditUserStack}
    />

    <Drawer.Screen
      name="UserSignatureStack"
      component={UserSignatureStack}
    />

    <Drawer.Screen
      name="Signout"
      component={SignoutScreen}
    />

  </Drawer.Navigator>
);

export default HomeNavigation;

通常会在HomeStack中打开并浏览所有堆栈，其中一个是UserSignatureStack：

import React from 'react';
import { createStackNavigator } from '@react-navigation/stack';
import ManageUserSignatureScreen from '../../screens/UserSignatureScreens/ManageUserSignatureScreen';
import EditUserSignatureScreen from '../../screens/UserSignatureScreens/EditUserSignatureScreen';
import { hamburguerLeftMenu, defaultNavigationOptions } from '../../components/navigation';

const Stack = createStackNavigator();

const UserSignatureStack = () => (
  <Stack.Navigator
   initialRouteName="ManageUserSignatureScreen"
   screenOptions={{
     ...defaultNavigationOptions,
     title: 'Assinatura e Rubrica',
   }}>

    <Stack.Screen
      name="ManageUserSignatureScreen"
      component={ManageUserSignatureScreen}
      options={({ navigation }) => ({
        title: 'Minhas Assinaturas',
        headerLeft: () => hamburguerLeftMenu({ navigation }),
      })}
    />

    <Stack.Screen
      name="EditUserSignatureScreen"
      component={EditUserSignatureScreen}
      options={({ route }) => ({
        title: route.params?.screen ?? 'signature' === 'signature'
          ? 'Sua assinatura'
          : 'Sua rubrica',

      })}
    />
  </Stack.Navigator>
);

export default UserSignatureStack;

在这里它应该打开，但是我不能从这里到那里去，它只是崩溃了。如果我尝试使用“ navigation.navigate”移动到同一堆栈中的任何屏幕，则会在堆栈浏览器（UserSignatureStack）中指责一个问题，并提示我：

cb is not a function. (In 'cb(event)', 'cb' is undefined)
- node_modules\@react-navigation\core\src\useEventEmitter.tsx:120:15 in React.useCallback$argument_0
* [native code]:null in forEach
- node_modules\@react-navigation\core\src\useEventEmitter.tsx:118:16 in React.useCallback$argument_0
- node_modules\@react-navigation\core\src\useFocusEvents.tsx:65:4 in React.useEffect$argument_0
- node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:16921:31 in commitHookEffectList
- node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:16970:29 in commitPassiveHookEffects
- node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:307:15 in invokeGuardedCallbackImpl
- node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:531:36 in invokeGuardedCallback
- node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:20061:28 in flushPassiveEffectsImpl
* [native code]:null in flushPassiveEffectsImpl
- node_modules\scheduler\cjs\scheduler.development.js:643:23 in unstable_runWithPriority
- node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:19597:25 in scheduleCallback$argument_1
- node_modules\scheduler\cjs\scheduler.development.js:482:68 in flushTask
- node_modules\scheduler\cjs\scheduler.development.js:607:20 in flushWork
- node_modules\scheduler\cjs\scheduler.development.js:58:18 in _flushCallback
- node_modules\react-native\Libraries\Core\Timers\JSTimers.js:146:14 in _callTimer
- node_modules\react-native\Libraries\Core\Timers\JSTimers.js:399:17 in callTimers
- node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:436:47 in __callFunction
- node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:111:26 in __guard$argument_0
- node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:384:10 in __guard
- node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:110:17 in __guard$argument_0
* [native code]:null in callFunctionReturnFlushedQueue

当我尝试返回时，得到了相同的内容，但是在Drawer Navigator（HomeNavigation）中出现了问题。

预期行为

我只是想从一个屏幕转到另一个屏幕。

您的环境

| Android | SDK 28 |

| @ react-navigation / native | 5.1.4 |

| @ react-navigation / stack | 5.2.9 |

| @ react-navigation /抽屉| 5.4.0 |

|反应本机手势处理程序| 1.6.0 |

|反应本地安全区域上下文| 0.7.3 |

|反应本机屏幕| 2.2.0 |

|反应本机| 61.4 |

|世博会| 37 |

|节点| 12.9.0 |

| npm或纱|纱线|