I can't seem to configure header to be null in the new version of React Navigation. I can set it to transparent, using the headerTransparent option, but this it looks like the header is still there, as the screen still requires a name. 

[Here is what I had initially, using the template that comes with a new Expo application](https://i.stack.imgur.com/hwQnf.png)

[And this is what it looks like with the header as transparent](https://i.stack.imgur.com/pNMDq.png). Which is essentially what I want to see but the title is still forced in there. 

I don't want a header with my navigation, but that looks like the default behavior. I tried looking through the documentation to see if there was such a prop to delete the header but encountered a 404 page for options: <https://reactnavigation.org/docs/en/navigation-options.html>

I'm new to React Native, so there may be something I am misunderstanding. But the documentation is unclear on this and I couldn't find a stackoverflow question directly addressing this.

Here is my App.js

```
import { NavigationContainer } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';

import BottomTabNavigator from './navigation/BottomTabNavigator';
import useLinking from './navigation/useLinking';

const Stack = createStackNavigator();

........

<NavigationContainer ref={containerRef} initialState={initialNavigationState}>
  <Stack.Navigator>
    <Stack.Screen name="root" component={BottomTabNavigator} options={{headerTransparent: true}}/>
  </Stack.Navigator>
</NavigationContainer>

```

Here is my BottomTabNavigator.js, which is very similar to the template code that expo provides. 

```
import * as React from 'react';
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
import TabBarIcon from '../components/TabBarIcon';
import HomeScreen from '../screens/Home';
import SearchScreen from '../screens/Search';

const BottomTab = createBottomTabNavigator();
const INITIAL_ROUTE_NAME = 'Home';

export default function BottomTabNavigator({ navigation, route }) {
  navigation.setOptions({ headerTitle: getHeaderTitle(route) });
  return (
    <BottomTab.Navigator initialRouteName={INITIAL_ROUTE_NAME}>
      <BottomTab.Screen
        name="Home"
        component={HomeScreen}
        options={{
          title: 'Home',
          tabBarIcon: ({ focused }) => <TabBarIcon focused={focused} name="md-home" />
        }}
      />
      <BottomTab.Screen
        name="Search"
        component={SearchScreen}
        options={{
          title: 'Search',
          tabBarIcon: ({ focused }) => <TabBarIcon focused={focused} name="md-search" />,
        }}
      />
    </BottomTab.Navigator>
  );
}

function getHeaderTitle(route) {
  const routeName = route.state?.routes[route.state.index]?.name ?? INITIAL_ROUTE_NAME;

  switch (routeName) {
    case 'Home':
      return 'How to get started';
    case 'Appointments':
      return 'Your appointments';
    case 'Search':
      return 'Search for services';
    case 'Account':
      return 'Account'
  }
}

```