Проблемы со стековыми навигаторами, вложенными в навигаторы ящиков - PullRequest
Новая
       32

Проблемы со стековыми навигаторами, вложенными в навигаторы ящиков

0 голосов
/ 03 апреля 2020

Я пытаюсь обновить реакцию реагирования с 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;

Здесь он открывается, как и должно, но я не могу go нигде отсюда, он просто падает. Если я пытаюсь перейти на любой экран в том же стеке с помощью «navigation.navigate», он обвиняет проблему в Stack Navigator (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

И когда я пытаюсь go обратно то же самое, но с проблемой в Навигаторе ящиков (HomeNavigation).

Ожидаемое поведение

Я просто хотел go с одного экрана на другой.

Ваше окружение

| Android | SDK 28 |

| @ реагировать-навигация / родной | 5.1.4 |

| @ реагировать-навигация / стек | 5.2.9 |

| @ реагировать-навигация / ящик | 5.4.0 |

| обработчик-реакция-родной-жест | 1.6.0 |

| реакция-родной-безопасный-район-контекст | 0.7.3 |

| реагировать родные экраны | 2.2.0 |

| Реактивный 61,4 |

| экспо | 37 |

| узел | 12.9.0 |

| npm или пряжа | пряжа |

...