How to set multi line header in react native?

user_9498532 0
Viewed 4987

I try to add a multi line title to my header like this:

    Title
  Subtitle

I tried the code below. It doesn't work, I got an error "title must be string or null"

 static navigationOptions = ({ navigation }) => {
    return {
    title: 
    <View>
    <Text>{navigation.getParam('client') }</Text>
    <Text>{navigation.getParam('ref') }</Text>
    </View>,

I followed this issue on github https://github.com/react-navigation/react-navigation/issues/2430

react-native
1 Answers

You need to replace title with headerTitle in order to provide the Custom Component.

The title prop accepts string values whereas the headerTitle defaults to a Text component that displays the title.

Therefore use it as 

static navigationOptions = ({ navigation }) => {
  return {
    headerTitle: (
      <View>
        <Text>{navigation.getParam('client')}</Text>
        <Text>{navigation.getParam('ref')}</Text>
      </View>
    )
  }
}
user_66068310
Related