Supply different title to the BottomTab screen header-CodePudding

In the code below the title goes into the bottom bar and the header, I am looking for a way to harcode a different title on the header and keep the other one

I do believe I need to add navigationOptions on the screen file itself but it doesnt reflect any change

   <BottomTab.Screen
    name="TabOne"
    component={TabOneScreen}
    options={({ navigation }: RootTabScreenProps<"TabOne">) => ({
      title: "Color Extractor",
      tabBarIcon: ({ color }) => <Ionicons name="ios-color-palette-outline" size={24} color="white" />,
    })}
    />

CodePudding user response：

Use tabBarLabel prop as mentioned in docs.

<BottomTab.Screen
  name="TabOne"
  component={TabOneScreen}
  options={({ navigation }: RootTabScreenProps<"TabOne">) => ({
    title: "My Title",
    tabBarLabel: "My Tab",
  })}
/>