Навигатор с вложенными стеками не маршрутизирует в реагирующей навигации 5.x - PullRequest
Новая
       10

Навигатор с вложенными стеками не маршрутизирует в реагирующей навигации 5.x

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

Приложение My React Native (0.61.5) имеет вложенную трехуровневую структуру маршрутизации реагирования (5.x), как показано ниже: 

App (NavigationContainter/StackNavigator)
    SplashScreen
    AppScreen (TabNavigator)
       EventStackScreen (StackNavigator)
         Event (screen)
         Chat (screen)
         Newevent (screen)
         Editevent (screen)
       GroupStackScreen (StackNavigator)
         Group (screen)
         Newgroup (screen)
       ContactStackScreen (StackNavigator)
         Contact (screen)
         Newcontact (screen)

Проблема заключается в том, что последний стековый навигатор EventStackScreen не имеет маршрут и застрял с начальным экраном (Event). Вот EventStackScreen в AppScreen: 

const EStack = createStackNavigator();
const EventStackScreen = () => {
   return (
      <EStack.Navigator initialRouteName="Event">
        <EStack.Screen name="Event" component={Event} />
        <EStack.Screen name="New Event" component={NewEventWithSelf} />
        <EStack.Screen name="Edit Event" component={EditEventWithSelf} />
        <EStack.Screen name="Chat" component={Chat} />
      </EStack.Navigator>
    );
  };

Для проверки я использую следующий простой код для Event и Chat:

Событие. js: 

import React, {useState, useContext, Component} from 'react';
import {View, Text, Button, TouchableOpacity, AppRegistry} from 'react-native';

export default function Event({ navigation }) {
    return (
      <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
        <Text>Go to Chat</Text>
        <Button
          title="To Chat"
          onPress={() => navigation.navigate('Chat')}
        />
      </View>
    );
  }

Чат: 

import React, {useState, useContext, Component} from 'react';
import {View, Text, Button, TouchableOpacity, AppRegistry} from 'react-native';

export default function Chat() {
    console.log("In test Chat");
    return (
      <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
        <Text>Chat Screen</Text>
      </View>
    );
  }

Если Event загружен изначально, то нажатие To Chat не go до Chat, хотя Chat.js выполнено, но никогда не отображается. Я предполагаю, что мой реагирующий навигационный код не должен быть правильным, но не может понять, что не так.

ОБНОВЛЕНИЕ: Вот файл console.log navigation.dangerouslyGetState().routes в Event.js и Chat.js: 

[23:29:36] I | ReactNativeJS ▶︎ 'navigation in Event : ', [ { key: 'Event-tr1t5BWaEyLW98gid-FOn',
                             │ name: 'Event',
                             │ params: undefined },
                             │ { key: 'Chat-ocavOljrIA9NiXox80Tv3',
                             │ name: 'Chat',
                             └ params: undefined } ]

[23:29:36] I | ReactNativeJS ▶︎ 'Routes In test Chat', [ { key: 'Event-tr1t5BWaEyLW98gid-FOn',
                             │ name: 'Event',
                             │ params: undefined },
                             │ { key: 'Chat-ocavOljrIA9NiXox80Tv3',
                             │ name: 'Chat',
                             └ params: undefined } ]
...