在CellForRowAt中调用方法下载图片后如何更新TableViewCell的ImageView

核心实现思路 #

• 给loadCountryImage方法增加完成回调，拿到下载后的图片资源
• 所有UI更新操作必须切换到主队列执行，否则会出现渲染异常甚至崩溃
• 增加cell复用校验逻辑，避免列表滑动时出现图片错位的问题
• 增加数据安全校验，避免强制解包导致的异常崩溃

代码修改示例 #

改造图片下载方法，增加完成回调 #

func loadCountryImage(country: String, completion: @escaping (UIImage?) -> Void) {
    let url = "https://www.countryflags.io/\(country)/shiny/24.png"
    guard let imageURL = URL(string: url) else {
        print("no URL found")
        completion(nil)
        return
    }
    let session = URLSession.shared
    session.dataTask(with: imageURL) { imageData, _, error in
        // 先做错误校验和数据校验，避免强制解包崩溃
        guard error == nil, let imageData = imageData, let image = UIImage(data: imageData) else {
            completion(nil)
            return
        }
        completion(image)
    }.resume()
}

改造cellForRowAt方法，处理图片赋值逻辑 #

override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCell(withIdentifier: "Cell", for: indexPath) as! CustomCell
    let stock = stocks[indexPath.row]
    // 先设置默认占位图，避免空白或者复用旧图片的问题
    cell.flagImageView.image = UIImage(named: "placeholder_flag")
    // 记录当前cell对应的国家，用于后续复用校验
    let targetCountry = stock.country
    
    loadCountryImage(country: targetCountry) { [weak self] downloadedImage in
        // 切换到主线程更新UI
        DispatchQueue.main.async {
            // 校验：当前cell对应的国家和下载的国家一致时才赋值，避免滑动复用错位
            guard let self = self,
                  self.stocks.indices.contains(indexPath.row),
                  self.stocks[indexPath.row].country == targetCountry else {
                return
            }
            cell.flagImageView.image = downloadedImage
        }
    }
    return cell
}

补充优化建议 #

• 如果列表滑动频率较高，建议增加内存+本地的二级图片缓存逻辑，避免重复下载相同国家的国旗，提升滑动流畅度
• 可自定义图片下载失败的兜底逻辑，比如下载失败时显示固定的默认无国旗占位图

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