web-dev-qa-db-fra.com

Comment changer le libellé du bouton de retour, react-navigation

J'utilise react-navigation, et je ne peux pas modifier les paramètres régionaux du bouton "retour" par défaut.

Dans mon Stack Navigator, si j'écris un titre pour la page principale, et si ce n'est pas trop long, il affichera le titre de la page au lieu de "retour".

export const Root = StackNavigator({
Index: {
    screen: Index,
    navigationOptions: ({ navigation }) => ({
        title: "My App name", //Not working when too long
    }),
},

Comment puis je faire ça ?

Default back button

react-nativelocalereact-navigation
10
FR073N

Vous pouvez utiliser headerBackTitle prop pour contrôler le titre du bouton de retour.

headerBackTitle

Chaîne de titre utilisée par le bouton de retour sur iOS, ou null pour désactiver l'étiquette. Par défaut, le headerTitle de la scène précédente

Exemple 

const SomeNavigator = StackNavigator({
   Main: { screen: Main },
   Login: { 
     screen: Login,
     navigationOptions: {
       headerBackTitle: 'some label'
     }
   }
 });
12
bennygenel

En fait, lorsque je mets à jour react-navigation à la version trois, le bouton de retour apparaît un titre.

enter image description here

J'ai donc passé un null à headerBackTitle et défini un composant sur headerBackImage et j'ai obtenu l'interface utilisateur ci-dessous que je désirais:

enter image description here

Alors écrivez comme ci-dessous:

defaultNavigationOptions: {
  headerBackImage: <GoBack />,
  headerBackTitle: null,
};

indice: veuillez utiliser defaultNavigationOptions au lieu de navigationOptions.

4
AmerllicA