Как показать заголовок заголовка в React Native с помощью React Navigation

Question

Я новичок в React Native, у меня проблема с отображением / отображением заголовка заголовка с помощью React Navigation, я пытаюсь найти, но не могу выполнить все.

Это мой полный сценарий:

Loginscreen.js

class LoginScreen  extends Component {
  static navigationOptions = {
    title: 'Login',
  };
  render() {
    return (
      <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
        <Text>Login Screen</Text>
        <Button title="Login To" onPress={() => this.props.navigation.navigate('Tabs')} />
        <Button title="Go To Register" onPress={() => this.props.navigation.navigate('Register')} />
      </View>
    );
  }
}

RegisterScreen.js

class RegisterScreen  extends Component {
  static navigationOptions = {
    title: 'Register',
  };
  render() {
    return (
      <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
        <Text>Register Screen</Text>
        <Button title="Go to Login" onPress={() => this.props.navigation.navigate('Login')} />
      </View>
    );
  }
}

HomeScreen.js

class HomeScreen  extends Component {
  static navigationOptions = {
    title: 'Home',
  };
  render() {
    return (
      <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
        <Text>Home Screen</Text>
        <Button title="Go to Login" onPress={() => this.props.navigation.navigate('Login')} />
      </View>
    );
  }
}

ProfileScreen.js

class ProfileScreen  extends Component {
  static navigationOptions = {
    title: 'Profile',
  };
  render() {
    return (
      <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
        <Text>Profile Screen</Text>
        <Button title="Go to Login" onPress={() => this.props.navigation.navigate('Login')} />
      </View>
    );
  }
}

App.js

и я получаю Результат вот так:

Пожалуйста, помогите мне показать / отобразить заголовок заголовка (красный кружок), заголовок заголовка в компоненте LoginScreen и Register в порядке, но в компоненте HomeScreen и ProfileScreen потеряны. Пожалуйста, помогите мне показать / показать его.

Спасибо.

Answer 1

Определите headerMode: 'screen', внутри вашего стекавигатора.

т.е. ваш rootStack

const rootStack = createStackNavigator(
{ 

},{
    headerMode: 'screen'
})