React Native构建后iOS模拟器无图标显示但Android真机正常 如何修复

Firebase远程图片可正常加载、本地图标显示空白的核心原因是：你当前使用的图片引用规则不适用于本地资源。
source={{ uri: 'filter' }} 写法仅支持HTTP/HTTPS协议的远程网络图片，完全无法识别RN项目里的本地静态资源。这类写法在构建时不会把目标文件打包进iOS安装包，模拟器自然找不到对应资源渲染。

• 引用项目内本地静态图片（png/jpg等格式）
  放弃uri字符串的引用方式，改用编译期require加载资源，把代码调整为：

  <Image source={require('./assets/icons/filter.png')} style={styles.button_icon} />
  

  注意：Web端习惯直接写相对路径引用资源，RN没有这个自动解析逻辑，不走require的本地文件在构建时会被排除在安装包外，无法被加载。
• 引用第三方矢量图标库（如react-native-vector-icons）的内置图标
  矢量图标不需要用Image组件渲染，替换为图标库提供的专属组件即可，例如：

  <Icon name="filter" size={20} color="#333" />
  

  结合你当前的版本组合（RN 0.61.5 + Xcode 12.4），这类矢量图标还要额外检查两项原生配置：
  • iOS目录下执行pod install后，是否正常完成了原生依赖链接
  • 项目的Info.plist文件中，是否添加了图标库对应的字体文件配置
• 通用易漏检查
  确认button_icon样式中设置了明确的固定宽高：和Web端图片自动适配内容尺寸的逻辑不同，RN的Image组件如果没有显式设置宽高，哪怕资源加载正常，也会因为渲染尺寸为0导致不可见。

调整上述配置后如果图标仍无法正常显示，可提供以下信息进一步定位：

• filter图标对应的实际存放路径、文件格式
• 项目集成的第三方图标库版本（如有）
• button_icon样式的具体配置值

内容的提问来源于stack exchange，提问作者Volodymyr RT