组件未在 headerTitle 中呈现

Question

我的 HomeHeader 组件未在 headerTitle 中呈现。我期待渲染，因为当我将其作为直接字符串执行时，它会显示在 headerTitle 中。

const HomeHeader = (props) => {
  return (
    <View>
    <Text>Home</Text>
    </View>
  )
}

function RootNavigator() {
  return (
    <Stack.Navigator>
      <Stack.Screen name="Home" component={HomeScreen} options={{headerTitle: HomeHeader}} />
      <Stack.Screen name="ChatRoom" component={ChatRoomScreen} options={{ headerShown: true }} />
    
      

      <Stack.Screen name="NotFound" component={NotFoundScreen} options={{ title: 'Oops!' }} />
      <Stack.Group screenOptions={{ presentation: 'modal' }}>
        <Stack.Screen name="Modal" component={ModalScreen} />
      </Stack.Group>
    </Stack.Navigator>
  );
}

我有什么遗漏吗？请在顶部查看 HomeHeader 组件，然后它当前位于我的主屏幕的 headerTitle 内。

Answer 1

我会为视图添加一些大小，并为文本添加一些样式...