React native 反应导航5-具有自定义标题的createNativeStackNavigator

我正在React本机应用程序上使用React navigation 5。我尝试将NativeStackNavigator与自定义头一起使用。使用React navigation 4可以工作，但使用5则不行

反应导航4：

import { createStackNavigator } from 'react-navigation-stack';

...

const _baseNavigationOptions = (props, icon, text) => {
    return ({
      headerTitle: () => <TitleComponent  {...props} config={someConfiguration}/>,
      headerStyle: {
        backgroundColor: '#6084AD',
      },
      headerTintColor: '#FFF'
    });
  }

...
const ConsumptionStackNavigator = createStackNavigator({
    Consumption: {
        screen: Consumption,
        navigationOptions: _baseNavigationOptions({name:'bars', type: 'font-awesome'}, 'My Consumptions')
    }
}

从“反应导航堆栈”导入{createStackNavigator}；
...
const_baseNavigationOptions=（道具、图标、文本）=>{
返回({
标题：（）=>，
头型：{
背景颜色：“#6084AD”，
},
标题颜色：“#FFF”
});
}
...
const ConsumptionStackNavigator=createStackNavigator({
消费：{
屏幕：消费，
导航选项：_baseNavigationOptions（{name:'bar'，键入：'font-awesome'}，'我的消费'）
}
}

当我尝试对reactNavigation 5执行相同的操作时，headerTitle不起作用：

import { createNativeStackNavigator } from '@react-navigation/native-stack';

...

  return (
      <Stack.Navigator
        initialRouteName="Consumption"
        screenOptions={{
          headerTitleAlign: 'center'
        }}>
        <Stack.Screen
          name="Consumption"
          component={ComsumptionComponent}
          options={{ header: (props) => _baseNavigationOptions(props, {name:'bars', type: 'font-awesome'}, 'My Consumption') }}
        />
...

从'@react-navigation/native-stack'导入{createNativeStackNavigator}；
...
返回(
_baseNavigationOptions（道具，{name:'bar'，键入：'font-awesome'}，'My-Consumption'）}
/>
...

标题显示的是消耗量，而不是我的自定义组件。如果我尝试使用headerRight而不是headerTitle，我也会遇到同样的问题

---

您能帮我吗：）

您正在v4代码中设置

导航选项

，但在v5代码中设置

标题

。您需要设置

选项

，而不是

标题

：

options={(props) => _baseNavigationOptions(props, {name:'bars', type: 'font-awesome'}, 'My Consumption')}

---

这只适用于createStackNavigator，但不适用于本机，应用程序在没有stacktrace的情况下崩溃。如果有机会，请帮助我。谢谢