[解決済み] スタックナビゲータでヘッダを隠す React ナビゲーション

質問

スタックとタブナビの両方を使用して画面を切り替えようとしています。

const MainNavigation = StackNavigator({
      otp: { screen: OTPlogin },
      otpverify: { screen: OTPverification},
      userVerified: {
        screen: TabNavigator({
          List: { screen: List },
          Settings: { screen: Settings }
        }),
      },
    });

この場合、スタックナビゲータが最初に使用され、次にタブナビゲータが使用されます。スタックナビゲータからヘッダを非表示にしたい。のようなナビゲーションオプションを使用すると、正しく動作しません。

navigationOptions: { header: { visible: false } }

このコードをstacknavigatorで使用している最初の2つのコンポーネントで試しています。 この行を使用すると、次のようなエラーが発生します。

解決方法は？

バージョン5時点のアップデート

バージョン5では、オプションとして headerShown で screenOptions

使用例です。

<Stack.Navigator
  screenOptions={{
    headerShown: false
  }}
>
  <Stack.Screen name="route-name" component={ScreenComponent} />
</Stack.Navigator>

もし、1画面だけヘッダーを隠したい場合は、スクリーンコンポーネントでscreenOptionsを設定することで実現できます。

<Stack.Screen options={{headerShown: false}} name="route-name" component={ScreenComponent} />

以下もご参照ください。 ブログ バージョン5について

アップデイト
バージョン2.0.0-alpha.36（2019-11-07）時点の情報です。
は、新しいnavigationOptionがあります。 headershown

      navigationOptions: {
        headerShown: false,
      }

https://reactnavigation.org/docs/stack-navigator#headershown

https://github.com/react-navigation/react-navigation/commit/ba6b6ae025de2d586229fa8b09b9dd5732af94bd

古い回答

私はこれをスタックバーを隠すために使っています（これは2番目のパラメータの値であることに注意してください）。

{
    headerMode: 'none',
    navigationOptions: {
        headerVisible: false,
    }
}

このメソッドを使用すると、全画面で非表示になります。

あなたの場合、このように表示されます。

const MainNavigation = StackNavigator({
  otp: { screen: OTPlogin },
  otpverify: { screen: OTPverification },
  userVerified: {
    screen: TabNavigator({
    List: { screen: List },
    Settings: { screen: Settings }
   }),
 }
},
{
  headerMode: 'none',
  navigationOptions: {
    headerVisible: false,
  }
 }
);