javascript - stackNavigator を強制的に MainScreen をターゲットにする方法は?

Question

私は呼び出している最初のオプションでaStackNavigatorと aを実装しました。問題は、Stack 画面をブラウズしているときに、Drawer を介してメイン画面に戻りたかったのですが、Stack はユーザーが最後に使用していた画面を保存しているため、これは起こりません。DrawerNavigatorDrawerNavigatorStackNavigator

いくつか使用してみNavigation Propましたが、このコードを挿入する場所や、スタックで使用するコマンドさえもわかりません。

MenuDrawer.js

import React from 'react';
import {
    View,
    ScrollView,
    Text,
    StyleSheet,
    TouchableOpacity,
    Image,
    Dimensions
} from 'react-native';

export default class MenuDrawer extends React.Component{
    navLink(nav, text) {
        return(
            <TouchableOpacity style={{height: 50}} onPress={() => this.props.navigation.navigate(nav)}>
                <Text style={styles.link}>{text}</Text>
            </TouchableOpacity>
        )
    }

    render() {
        return(
            <ScrollView styles={styles.continer}>
                <View style={styles.topImage}>
                    <Image style={styles.image} source={require('../images/informationappscreen/act.png')} />
                </View>

                <View style={styles.bottomLinks}>
                    {this.navLink('Principal', 'Principal')}
                    {this.navLink('Sobre o Aplicativo', 'Sobre o Aplicativo')}
                    {this.navLink('Sobre os Responsáveis', 'Sobre os Responsáveis')}
                    {this.navLink('Sobre o Projeto', 'Sobre o Projeto')}
                    {this.navLink('Política e Termos', 'Política e Termos')}
                </View>

                <View style={styles.footer}>
                    <Text style={styles.description}>ACT</Text>
                    <Text style={styles.version}>v1.3.0</Text>
                </View>
            </ScrollView>
        );
    }
}

App.js

import React from 'react';
import { View, Dimensions } from 'react-native';
import { Button, Icon } from 'native-base';
import { createAppContainer, createStackNavigator, createDrawerNavigator } from 'react-navigation';
...

const HomeNavigator = createStackNavigator ({
  'Main1': {
    screen: Main1,
    navigationOptions: {
      title: 'Menu Principal',
      headerRight: (<View></View>)
    }
  },
  'Main2': {
    screen: Main2,
    navigationOptions: {
      title: 'Menu Principal',
      headerRight: (<View></View>)
    },
  },
  'SecondMain': {
    screen: SecondMain,
    navigationOptions: {
      title: 'Menu Querer'
    }
  },
  'Action1': {
    screen: Action1,
    navigationOptions: {
      title: 'Ações'
    }
  },
...
}, {
  defaultNavigationOptions: ({ navigation }) => {
    return {
      headerTitleStyle: {
        fontWeight: 'bold'
      },
      headerLeft: (
        <Button transparent onPress={() => navigation.toggleDrawer()}>
          <Icon name='menu' style={{color: '#FFF'}} />
        </Button>
      ),
      headerRight: (
        <HomeIcon navigation={navigation} />
      ),
      headerStyle: {
        backgroundColor: '#b80003'
      },
      headerTintColor: '#FFF'
    }
  }
});

const DrawerConfig = {
  drawerWidth: Dimensions.get('window').width * 0.75,
  contentComponent: ({ navigation }) => {
    return(<MenuDrawer navigation={navigation} />)
  }
}

const DrawerNavigator = createDrawerNavigator (
  {
    'Principal': {
      screen: HomeNavigator
    },
    'Sobre o Aplicativo': {
      screen: InformationApp
    },
    'Sobre os Responsáveis': {
      screen: Team
    },
    'Sobre o Projeto': {
      screen: Project
    },
    'Política e Termos': {
      screen: Policy
    }
  },
  DrawerConfig
);

const AppDrawerContainer = createAppContainer(DrawerNavigator);

export default AppDrawerContainer;