[解決済み] ホーム画面のナビゲーションスタックをリセットする（React NavigationとReact Native）

質問

のナビゲーションに問題があります。 リアクト ナビゲーション とReact Nativeを組み合わせたものです。ナビゲーションをリセットしてホーム画面に戻ることです。

私はDrawerNavigatorの中にStackNavigatorを構築し、ホーム画面と他の画面間のナビゲーションは動作しています。しかし、問題は、ナビゲーション スタックがどんどん大きくなっていくことです。スタックから画面を削除する方法がよくわかりません。

たとえば、ホーム画面から設定画面に行き、次に入力画面に行き、最後に再びホーム画面に行くとき、ホーム画面はスタックの中に 2 回あります。戻るボタンではアプリから抜け出せず、再びエントリー画面に戻ってしまいます。

ホームボタンを再度選択すると、スタックがリセットされると良いのですが、その方法がわかりません。 ここで が同じような問題を持つ他の人を助けようとしましたが、解決策は私のために動作しませんでした。

const Stack = StackNavigator({
  Home: {
    screen: Home
  },
  Entry: {
    screen: Entry
  },
  Settings: {
    screen: Settings
  }
})

export const Drawer = DrawerNavigator({
  Home: {
    screen: Stack
  }},
  {
    contentComponent: HamburgerMenu
  }
)

そして、これはドロワー画面の簡単な例です。

export default class HamburgerMenu extends Component {
  render () {
    return <ScrollView>
      <Icon.Button
        name={'home'}
        borderRadius={0}
        size={25}
        onPress={() => { this.props.navigation.navigate('Home')}}>
        <Text>{I18n.t('home')}</Text>
      </Icon.Button>

      <Icon.Button
        name={'settings'}
        borderRadius={0}
        size={25}
        onPress={() => { this.props.navigation.navigate('Settings')}}>
        <Text>{I18n.t('settings')}</Text>
      </Icon.Button>

      <Icon.Button
        name={'entry'}
        borderRadius={0}
        size={25}
        onPress={() => { this.props.navigation.navigate('Entry')}}>
        <Text>{I18n.t('entry')}</Text>
      </Icon.Button>
    </ScrollView>
  }
}

助けていただけると幸いです。これはナビゲーションの不可欠な部分であり、解決策があれば最高です!

どのように解決するのですか？

これは、私がそれを行う方法です。

reset(){
    return this.props
               .navigation
               .dispatch(NavigationActions.reset(
                 {
                    index: 0,
                    actions: [
                      NavigationActions.navigate({ routeName: 'Menu'})
                    ]
                  }));
  }

少なくとも'Menu'を'Home'に置き換えてください。 また、this.props.navigationをあなたの実装に合わせたいと思うかもしれません。

バージョン > 2 では、これに従います。

import { NavigationActions, StackActions } from 'react-navigation';
        const resetAction = StackActions.reset({
                index: 0,
                actions: [NavigationActions.navigate({ routeName: 'MainActivity' })],
            });

this.props.navigation.dispatch(resetAction);