Заголовок не работает в createSwitchNavigator - PullRequest
Новая
       3

Заголовок не работает в createSwitchNavigator

0 голосов
/ 28 июня 2019

Мой createSwitchNavigator имеет 3 страницы: Логин (без заголовка). После входа в систему он отправляет на главную страницу, где я строю свой навигатор по низу, вкладке, стеку и ящику. 

const MainTabNavigator = createBottomTabNavigator({
    Home,
    Tenants,
    WorkOrders: {
      screen: WorkOrders,
      navigationOptions: {
        title: 'Work Orders'
      }
    }
}, {
  navigationOptions: ({ navigation }) => {
      const { routeName } = navigation.state.routes[navigation.state.index];
      if (routeName === 'WorkOrders') {
        return {
          headerTitle: 'Work Orders'
        };
      }
      return {
        headerTitle: routeName
      };
  }
});

const MainStackNavigator = createStackNavigator({
    MainTabNavigator
}, {
  defaultNavigationOptions: ({ navigation }) => {
      return {
        headerLeft: (
          <Icon
            style={{ paddingLeft: 10 }}
            onPress={() => navigation.openDrawer()}
            name="md-menu"
            size={30}
          />
        )
      };
    }
});

const AppDrawerNavigator = createDrawerNavigator({
  iRent: {
    screen: MainStackNavigator
  }
});

const AppSwitchNavigator = createSwitchNavigator({
  Login: { screen: Login },
  Main: { screen: AppDrawerNavigator },
  TenantDetails: {
    screen: TenantDetails,
    navigationOptions: () => {
      return {
        headerTitle: 'Tenant'
      };
    }
  },
});

const AppContainer = createAppContainer(AppSwitchNavigator);

От арендаторов я перехожу на страницу TenantDetails, но в TenantDetails заголовок не отображается. Почему?

1 Ответ

1 голос
/ 29 июня 2019

Навигатор коммутатора не имеет заголовка.Вместо этого вы можете использовать стековый навигатор.Пример кода: 

const AppStackNavigator = createStackNavigator({
    Login: {
        screen: Login,
        navigationOptions:{
            header: null  // to override the header, because even if you don't specify the header title, a header will be shown.
        }
    },
    Main: {
        screen: AppDrawerNavigator,
        navigationOptions:{
            header: null  
        }
    },
    TenantDetails: {
        screen: TenantDetails,
        navigationOptions: {
            headerTitle: 'Tenant',
            headerLeft: null  // If you want to override the back button, use this.
        }
    },
});

const AppContainer = createAppContainer(AppStackNavigator);
...