неправильная навигация в реагировать на родной

Question

Я использую реагирующую навигацию для управления навигацией моего приложения.У меня есть одна проблема.У меня 5 навигационных файлов.У меня есть createMaterialTopTabNavigator, который использует его на StackNavigator.но я не могу перемещаться между ними.

my createMaterialTopTabNavigator

import React, { Component } from 'react';
import {
  StyleSheet,
  View,
  Dimensions,
} from 'react-native';
import { createMaterialTopTabNavigator ,createAppContainer} from 'react-navigation';
import OneWay from '../Components/MainSearch/OneWay' ;
import TwoWay from '../Components/MainSearch/TwoWay';
import SeveralWay from '../Components/MainSearch/SeveralWay';

const FlightOptions = createMaterialTopTabNavigator({
  'چندمقصده':{
    screen: SeveralWay,
    navigationOptions:{
      header: null, headerMode: 'none',swipeEnabled:true}

  },
  'یک طرفه':{
    screen: OneWay,
    navigationOptions:{
      header: null, headerMode: 'none',swipeEnabled:true}
  },
  'رفت و برگشت':{
    screen: TwoWay,
    navigationOptions:{
      header: null, headerMode: 'none',swipeEnabled:true}
  }
},
{
  tabBarOptions: {
    labelStyle: {
      fontSize: 15,
      color: '#15479F',
      fontFamily : 'Sahel-Bold',
      textDecorationLine: 'underline',
    },

    style: {
      shadowOpacity: 0,
      shadowOffset: {
        height: 0,
      },
      shadowRadius: 0,
      elevation: 0,
      backgroundColor: '#fff',
    },
    tabStyle:{
    },
    indicatorStyle :{
      opacity: 0
    }
  }
},
{
  headerMode: 'none',
  navigationOptions: {
    headerVisible: false,
  }
 }
);

export default createAppContainer(FlightOptions);

и мой stackNavigator:

import React, { Component } from 'react';
import {
  StyleSheet,
  View,
} from 'react-native';
import { createStackNavigator ,createAppContainer} from 'react-navigation';
import Calendar from '../Components/MainSearch/Calendar';
import AirLineSearchResult from '../Components/MainSearch/AirLineSearchResult';
import OneWay from '../Components/MainSearch/OneWay' ;
import TwoWay from '../Components/MainSearch/TwoWay';
import SeveralWay from '../Components/MainSearch/SeveralWay';


const Detail = createStackNavigator(
  {
    OneWay:{
      screen : OneWay,
      navigationOptions: {
        header: null, headerMode: 'none'
      }
    },
    TwoWay:{
      screen : TwoWay,
      navigationOptions: {
        header: null, headerMode: 'none'
      }
    },
    SeveralWay:{
      screen : SeveralWay,
      navigationOptions: {
        header: null, headerMode: 'none'
      }
    },
    Calendar:{
      screen : Calendar,
      navigationOptions: {
        header: null, headerMode: 'none'
      }
    },
    AirLineSearchResult:{
      screen : AirLineSearchResult,
      navigationOptions: {
        header: null, headerMode: 'none'
      }
    },
  },
  {
    headerMode: 'none',
    navigationOptions: {
      headerVisible: false,
    }
  }
);

export default createAppContainer(Detail);

моя основная навигация в приложении:

import { createStackNavigator, createAppContainer } from 'react-navigation';
import Splash from '../Components/Splash';
import WalkThrough from '../Components/WalkThrough';
import Login from '../Components/Login/Login';
import Validation from '../Components/Login/Validation';
import MainSearchNavigation from './MainSearchNavigation';
import OneWay from '../Components/MainSearch/OneWay';

import AirLineNavigation from './AirLineNavigation';
import HotelSearchNavigation from './HotelSearchNavigation';

const AppNavigator = createStackNavigator(
  {
    Splash: Splash,
    WalkThrough: WalkThrough,
    Login : Login,
    Validation : Validation,
    OneWay : OneWay,
    MainSearchNavigation :{
      screen : MainSearchNavigation,
      navigationOptions: {
        header: null, headerMode: 'none'
        }
    },
    AirLineNavigation:{
      screen :AirLineNavigation,
      navigationOptions: {
        header: null, headerMode: 'none'
        }
    },
    HotelSearchNavigation:{
      screen :HotelSearchNavigation,
      navigationOptions: {
        header: null, headerMode: 'none'
        }
    },
  },
  {
    initialRouteName: "Splash"
  },
  {
    headerMode: 'none',
    navigationOptions: {
      headerVisible: false,
    }
   }
);

export default createAppContainer(AppNavigator);

и код OneWay, который не работал.

<TouchableOpacity
  style={styles.buttonText}
  onPress={()=>this.props.navigation.navigate('AirLineSearchResult')}
  >
    <View style={styles.buttonContainer}>
      <Text
        style={styles.okBotton}
        >جست و جو</Text>
    </View>
</TouchableOpacity>

Answer 1

В вашем приложении более одного StackNavigator.Вы пытаетесь перейти к экрану, который находится в другом стеке.Поэтому вы должны также передать имя стека.Предполагая, что у вас есть основной StackNavigator, который вы экспортируете в ваш app.js, у вас будет что-то вроде этого:

-Main Navigator
  -ChildNavigator1
    -Screen1
    -Screen2
  -ChildNavigator2
    -Screen3
    -Screen4

Затем, если вы находитесь на Screen4 и хотите перейти к Screen1:

this.props.navigation.navigate('ChildNavigator1', {}, NavigationActions.navigate({ routeName: 'Screen1' }))

Также не забудьте импортировать NavigationActions из реагирования-навигации.