Ionicons图标在iOS模拟器中不显示的问题求助

各位大佬好，我现在碰到一个头疼的问题：我写了一个返回上一页的按钮组件，里面用到了Ionicons的图标，但在iOS模拟器里这个图标就是不显示。预期的图标应该像图里这样（预期显示的Chevron左箭头图标），但实际完全看不到它的踪影。

下面是我的组件代码：

// ChevronLeftButton.tsx

import React from 'react';

import { TouchableOpacity, StyleSheet, GestureResponderEvent } from 'react-native';

import Ionicons from 'react-native-vector-icons/Ionicons';

type ChevronLeftButtonProps = {
  onPress: (event: GestureResponderEvent) => void;
  color?: string;
  size?: number;
};

const ChevronLeftButton: React.FC<ChevronLeftButtonProps> = ({
  onPress,
  color = 'black', // default color
  size = 25, // default size
}) => {
  return (
    <TouchableOpacity style={styles.button} onPress={onPress}>
      <Ionicons name="chevron-back" size={size} color={color} />
    </TouchableOpacity>
  );
};

const styles = StyleSheet.create({
  button: {
    position: 'absolute',  // Position the button absolutely within its container
    top: 50,
    left: 12,
    padding: 10, // Add padding for a larger touch area
    color: 'white'
  },
});

export default ChevronLeftButton;

我已经成功执行了yarn add react-native-vector-icons命令，而且App运行起来没有任何警告或者错误信息，就是图标死活不显示，有没有大佬能帮我排查下问题出在哪？

备注：内容来源于stack exchange，提问作者Etienne Herlaut