React Navigation でデフォルトのビューを設定する

いままで何となくでやっていたので、改めてインプットしたのでメモ。

結論、以下のように initialRouteName という Props を Stack.Navigator に渡してやれば良いようです。こう書くと、Login 画面が始めに表示されるようになります。

JavaScript
<NavigationContainer>
    <Stack.Navigator initialRouteName={"Login"}>
      <Stack.Screen name={"Home"} component={Home} />
      <Stack.Screen name={"Login"} component={Login} />
      <Stack.Screen name={"Result"} component={Result} options={{ title: "Result" }} />
    </Stack.Navigator>
  </NavigationContainer>

（公式ドキュメント）createStackNavigator | React Navigation

じゃあ、いままで何を何となくでやっていたのかというと、別にこれ指定しなくても動くんですよね。暗黙的に Stack.Screen の順番が意味を持っていて、一番はじめに書かれているものが initialRoute になるような設定になっているようです。

いままでこの暗黙的な設定でなんとなく動くものしか書いたことなかったので、改めて理解したのでメモ。明示的に書いておいた方が分かりやすくて良いですね。