React-Navigation: nie można ukryć nagłówka za pomocą zagnieżdżonych nawigatorów.

Question

Używam oficjalnego react-navigation do obsługi nawigacji. Mam jeden główny TabNavigator dla całej aplikacji z dwóch zakładek (tzw HitchhikingMapNavigator i SettingsNavigator poniżej), a każda karta ma zagnieżdżonego StackNavigator:

const HitchhikingMapNavigator = StackNavigator({ 
    hitchhikingMap: { screen: HitchhikingMapViewContainer }, 
    spotDetails: { screen: SpotDetailsViewContainer } 
}, { 
    navigationOptions: { 
    header: { 
     visible: false 
    } 
    } 
}); 

const SettingsNavigator = StackNavigator({ 
    // some other routes 
}); 

export default AppNavigator = TabNavigator({ 
    hitchhikingMap: { screen: HitchhikingMapNavigator }, 
    settings: { screen: SettingsNavigator } 
}, { 
    navigationOptions: { 
    header: { 
     visible: false, 
    }, 
}, 
}); 

Jak widać, kładę visilibility nagłówki false wszędzie, nawet w moich HitchhikingMapViewContainer „s widok:

class HitchhikingMapView extends React.Component { 

    static navigationOptions = { 
    title: 'Map', 
    header: { 
     visible: false, 
    }, 
    //...other options 
    } 

A jednak, pasek nagłówka jest nadal widoczny:

Jeśli nie zagnieżdżę nawigatorów (tj. jeśli wstawię ten kod, pomijając zagnieżdżony):

export default AppNavigator = TabNavigator({ 
    hitchhikingMap: { screen: HitchhikingMapViewContainer }, 
    settings: { screen: SettingsNavigator } 
}); 

to nagłówek jest poprawnie ukryty.

Wniosek: nie mogę utworzyć nagłówka niewidocznego, gdy mam dwa zagnieżdżone nawigatory. Jakieś pomysły?

Answer 1

Dla tych, którzy wciąż szukają odpowiedzi, będę je zamieszczać tutaj.

więc dwa rozwiązania:

1-ty rozwiązanie: użyć headerMode: 'none' w StackNavigator. Spowoduje to usunięcie nagłówka z wszystkich ekranach w StackNavigator

2. Rozwiązanie: Użyj headerMode: 'screen' w StackNavigator i dodać header: { visible: false } w navigationOptions ekranów, gdzie chcesz, aby ukryć nagłówek.

Więcej informacji można znaleźć tutaj: https://reactnavigation.org/docs/navigators/stack

Answer 2

Ten pracował dla mnie:

headerMode: 'none' 

Answer 3

Począwszy od v1.0.0-beta.9, należy użyć następującego,

static navigationOptions = { 
    header: null 
} 

Answer 4

ten pracował dla mnie, ja pracuję na Androidzie strony w reagują natywną wersję 0.45

static navigationOptions = { 
    header: null 
} 

Answer 5

To działa dla mnie, aby ukryć nawigację:

static navigationOptions = { 
    header: null 
};