从Firebase存储中提取图像时，图像不会加载，直到我通过滚动与tableView进行交互.斯威夫特 3.

Question

我在推特/Instagram(如新闻提要(上遇到了问题......

从 Firebase 存储中提取图像时，图像不会加载，直到我通过滚动与 tableView 交互...我滚动得越多，我就越能出现。它有时也会随机显示错误的帖子图像，直到我再滚动一些，最终所有图像都会加载，它们都落在正确的位置。

这没有意义...我所有的逻辑都是正确的，我在从数据库加载图像网址时使用 cachedImages。我看了很多视频教程，它们都使用与我使用过类似的方法，但它们都没有任何错误的问题，就像我一样。

关于问题可能是什么的任何想法？

法典：

var imageCache = [String: UIImage]()
var lastURLUsedToLoadImage: String?

// loading user image  from urls
extension UIImageView {

func loadImage(urlString: String) {

lastURLUsedToLoadImage = urlString

if let cachedImage = imageCache[urlString] {
self.image = cachedImage
return
}

guard let url = URL(string: urlString) else { return }

URLSession.shared.dataTask(with: url) { (data, response, err) in
if let err = err {
print("Failed to fetch post image:", err)
return
}

if url.absoluteString != lastURLUsedToLoadImage {
return
}

guard let imageData = data else { return }

let photoImage = UIImage(data: imageData)

imageCache[url.absoluteString] = photoImage

DispatchQueue.main.async {
self.image = photoImage
}

}.resume()
}
}

Answer 1

你应该使用

tableView.reloadData()

下载图像时。

Answer 2

看起来你的变量lastURLUsedToLoadImage是全局的 - 你必须"每个单元格"存储该数据，而不是全局。

这不是一件容易的事，我建议使用图像缓存库，就像这个 https://github.com/onevcat/Kingfisher

使用翠鸟加载图像非常简单，看看这个：

imageView.kf.setImage(with: URL(string: urlString))

Answer 3

我想通了。我把所有东西都藏在一个自定义UIImageView类中，除了var imageCache = String：UIImage。我离开了全球。一切正常。

因此，与其说 UIImageView 是一个扩展，不如说它是它自己的自定义类。

因此，将所有使用 loadImage(urlString： String( 函数的 UIImageView 更改为 CustomImageView。

例：

@IBOutlet弱变量用户图片：UIImageView！

更改为

@IBOutlet弱变量用户图像：自定义图像视图！

import UIKit
// global var
var imageCache = [String: UIImage]()
class CustomImageView: UIImageView {
var lastURLUsedToLoadImage: String?
func loadImage(urlString: String) {
lastURLUsedToLoadImage = urlString
self.image = nil
if let cachedImage = imageCache[urlString] {
self.image = cachedImage
return
}
guard let url = URL(string: urlString) else { return }
URLSession.shared.dataTask(with: url) { (data, response, err) in
if let err = err {
print("Failed to fetch post image:", err)
return
}
if url.absoluteString != self.lastURLUsedToLoadImage {
return
}
guard let imageData = data else { return }
let photoImage = UIImage(data: imageData)
imageCache[url.absoluteString] = photoImage
// update the UI
DispatchQueue.main.async {
self.image = photoImage
}
}.resume()
}
}

调用加载方法的示例：

cell.userImage.loadImage(urlString: userImageUrl)