iOS14下SwiftUI网格首次点击详情不显示问题求助

问题现象 #

• 首次点击网格单元格时，控制台能正常打印选中的Movie对象，但详情sheet视图无内容显示；后续点击则完全正常。
• 视图位于Tab页面中，已排除Tab组件影响；测试时未给url赋值，用于验证图片加载失败场景。

问题根源 #

问题出在sheet显示时机与状态更新的同步性上：
iOS 14的SwiftUI中，使用sheet(isPresented:)时，sheet的内容视图会在isPresented变为true的瞬间初始化。首次点击时，虽然先给selectedMovie赋值，再通过DispatchQueue.main.async设置isShowingDetails = true，但SwiftUI的状态调度机制会导致sheet初始化时，selectedMovie的更新还未完成，最终详情视图拿到的是nil。
另外，DispatchQueue.main.async属于多余操作——Button的action本身就在主队列执行，反而打乱了状态更新的顺序。

解决方案 #

方案1：使用sheet(item:)替代sheet(isPresented:)（推荐） #

SwiftUI提供的sheet(item:)API专门用于绑定可选的Identifiable对象，当对象从nil变为非nil时自动弹出sheet，能彻底避免状态同步问题。

修改FourthViewWithGrid代码如下：

struct FourthViewWithGrid: View {
    @EnvironmentObject var classFromEntryPoint: ClassFromEntryPoint
    
    @State private var movies: [Movie] = []
    @State private var selectedMovie: Movie? // 不再需要isShowingDetails状态
        
    let columns = [
        GridItem(.flexible()),
        GridItem(.flexible())
    ]
    
    var body: some View {
        NavigationView {
            ScrollView {
                LazyVGrid(columns: columns, spacing: 20) {
                    ForEach(movies) { movie in
                        Button(action: {
                            self.selectedMovie = movie
                            print("selected: \(movie)")
                        }) {
                            VStack {
                               AsyncImageView(url: movie.url ?? "")
                                    .aspectRatio(contentMode: .fill)
                                    .frame(width: 100, height: 100)
                                    .cornerRadius(10)
                                
                                Text(movie.title ?? "ND/")
                                    .font(.headline)
                                    .lineLimit(1)
                                
                                if let year = movie.year {
                                    Text("\(year)")
                                        .font(.subheadline)
                                }
                            }
                        }
                    }
                }
                .padding()
            }
            .navigationTitle("Movies")
            // 使用sheet(item:)绑定选中的电影对象
            .sheet(item: $selectedMovie) { movie in
                Text(movie.title ?? "default title")
            }
        }
        .onAppear {
            movies = classFromEntryPoint.movies
        }
    }
}

方案2：保留sheet(isPresented:)并调整状态逻辑 #

如果必须保留原有的isShowingDetails状态，只需去掉多余的DispatchQueue.main.async，确保selectedMovie赋值完成后再触发sheet显示：

Button(action: {
    self.selectedMovie = movie
    print("selected: \(movie)")
    // 直接设置状态，无需异步调度
    self.isShowingDetails = true
}) {
    // 按钮内容保持不变
}

额外优化建议 #

1. 优化Movie的id属性：
   当前id使用UUID().uuidString会每次生成新字符串，改为UUID类型更高效：

struct Movie: Identifiable {
    let id = UUID() // 改为UUID类型，而非字符串
    var title: String?
    var year: Int?
    var url: String?
}

2. 优化AsyncImageView的加载逻辑：
   当url为空时，无需发起网络请求，增加判断：

.onAppear {
    if !url.isEmpty {
        loader.load(fromURLString: url)
    }
}

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