SwiftUI Preview Canvas无法加载本地文件解码的结构体数据

问题现象 #

• 目标：基于本地缓存的API数据实现SwiftUI Previews调试能力，实现无需启动模拟器即可直接预览视图效果，目前遇到异常无法定位原因。
• 前置情况：首次学习SwiftUI，正在移植原有应用的视图模块；业务数据为只读属性，未使用@State、@Binding、@EnvironmentObject做状态/全局管理。
• 已尝试操作：查阅多份SwiftUI预览相关教程、大量Stack Overflow方案均未解决；教程中读取本地JSON的预览Demo可以正常运行，自有代码异常。
• 异常表现：
  • Preview Canvas仅渲染默认占位内容：
  • 完全相同的代码在模拟器中运行可正常加载头像、用户名：
• 参考教程：
  • SwiftUI预览本地数据实现教程1
  • SwiftUI预览本地数据实现教程2

相关代码 #

视图实现代码 #

@available(iOS 13, *)
struct avatarView: View {
  let weeklySummary: [HelperIntervalsIcu.icuWeeklyData]
  
  func getAvatarPic() -> UIImage? {
      if let avatarUrl = weeklySummary.last?.icuAvatar {
        let avatarPicName = URL(fileURLWithPath: avatarUrl).lastPathComponent
        let avatarPicImage = HelperIntervalsIcu.loadAvatarPic(fileName: avatarPicName)
        return avatarPicImage
      }
    return nil
  }
  
  func getUserName() -> String {
    if let userName = weeklySummary.last?.icuName {
      return userName.prefix(1).capitalized + userName.dropFirst()
    }
    return "User Name Placeholder"
  }
  
  var body: some View {
    HStack {
      if let image = getAvatarPic() {
        Image(uiImage: image)
      } else {
        Image("profile-200x200")
      }
      Text(getUserName())
      Spacer()
    }
  }
}

@available(iOS 13.0, *)
struct IntervalsWeeklyView_Previews: PreviewProvider {
    static var previews: some View {
      let weeklySummary = HelperIntervalsIcu.loadWeeklySummaryFromFile()
      avatarView(weeklySummary: weeklySummary)
    }
}

数据模型定义 #

HelperIntervalsIcu.icuWeeklyData为遵循Codable协议的结构体：

struct icuWeeklyData : Codable {
  var icuName : String
  var icuAvatar : String
} 

根因说明 #

问题核心是SwiftUI Preview运行在独立的进程沙盒中，和模拟器/真机的应用沙盒完全隔离：你当前实现的loadWeeklySummaryFromFile、loadAvatarPic方法是从应用沙盒的缓存/Documents目录读取之前下载的API数据、头像缓存，Preview进程没有权限访问模拟器沙盒内的这些缓存文件，所以读取到的weeklySummary是空数组，最终只能走占位视图的分支逻辑。模拟器运行时可以正常访问自身沙盒内的缓存，所以表现正常。

修复步骤 #

1. 给预览逻辑单独加环境判断，Preview环境下不要读沙盒缓存，直接从当前Target的Bundle中读取预览专用的测试JSON、测试头像资源。示例修改加载方法：

   static func loadWeeklySummaryFromFile() -> [icuWeeklyData] {
     #if DEBUG
     // 判断当前是否运行在Preview环境
     if ProcessInfo.processInfo.environment["XCODE_RUNNING_FOR_PREVIEWS"] == "1" {
       // 提前把预览用的测试JSON文件拖入工程，勾选加入当前视图所在的Target
       guard let jsonUrl = Bundle.main.url(forResource: "weeklyPreviewTestData", withExtension: "json"),
             let jsonData = try? Data(contentsOf: jsonUrl),
             let previewData = try? JSONDecoder().decode([icuWeeklyData].self, from: jsonData) else {
         return []
       }
       return previewData
     }
     #endif
     // 原有沙盒读取逻辑保持不变，模拟器/真机运行时走该分支
     // 保留你之前实现的从沙盒读缓存的代码即可
   }
   

2. 头像加载逻辑同步修改：Preview环境下不要读取沙盒缓存的头像，要么把测试头像加入工程Bundle通过UIImage(named:)加载，要么在Preview分支直接返回测试用的头像实例。
3. 资源校验：检查预览用的测试JSON、默认占位图profile-200x200的Target Membership是否勾选了当前视图所在的编译Target，Preview无法访问未纳入当前Target的资源。
4. 快速验证方法：可以在IntervalsWeeklyView_Previews的previews方法里加一行print(weeklySummary)，点击Preview Canvas下方的调试控制台按钮，看打印的数组内容是否为空，即可确认是否是文件读取失败的问题。

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