React-навигация: как использовать разные headerBackTitles в одном StackNavigator - PullRequest
Новая
       49

React-навигация: как использовать разные headerBackTitles в одном StackNavigator

0 голосов
/ 06 апреля 2019

Я использую реагирующую навигацию для своего приложения «Реактив-родной». Я прочитал документы на headerBackTitle , но я не могу понять, как установить разные headerBackTitle для навигации по разным экранам в стеке.

При переходе от EditProfile к MyProfile , я хочу, чтобы headerBackTitle: сказать Cancel.

При переходе от Комментарии к MyProfile , я хочу, чтобы headerBackTitle говорил Go back.

В настоящее время идет от комментариев и EditProfile до MyProfile скажем Cancel. Как мне это сделать? 

const MyProfileStack = createStackNavigator({
  MyProfile: {
    screen: profile,
    navigationOptions: {
      headerTitle: "My Profile",
      headerBackTitle: 'Cancel'
    }
  },
  Comments: { 
    screen: comments, 
    navigationOptions: {
      headerTitle: "Comments"
    },
  },
  EditProfile: {
    screen: editProfile,
    navigationOptions: {
      headerTitle: "Edit Profile"
    },
  }
})

1 Ответ

0 голосов
/ 08 апреля 2019

Еще один способ сделать это - создать собственный заголовок, например

Comments.js 

class Comments extends React.Component{
 render(){
  return(
     <View style={{flex:1}}>
      <View style={styles.header}>
        <Text onPress={() => this.props.navigation.goBack(null)}>Go Back</Text>
        <Text>Comments</Text>
      </View>
     </View>
     )
    }
   }

EditProfile.js 

class Comments extends React.Component{
     render(){
      return(
         <View style={{flex:1}}>
          <View style={styles.header}>
            <Text onPress={() => this.props.navigation.goBack(null)}>Cancel</Text>
            <Text>Edit Profile</Text>
          </View>
         </View>
         )
        }
       }
...