從Firebase存儲器中提取圖像時，直到我通過滾動與tableView交互時，圖像才加載... SWIFT 3

Question

我在使用Twitter / Instagram等新聞提要時遇到了問題…

當從Firebase存儲器中提取圖像時，直到我通過滾動與tableView交互時，圖像才會加載...滾動的次數越多，出現的內容就越多。 有時它還會隨機顯示錯誤的帖子圖像，直到我再滾動一些，最終所有圖像加載完畢，並且它們都放置在正確的位置。

這沒有任何意義……我所有的邏輯都是正確的，並且從數據庫加載圖像URL時我正在使用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

使用Kingfisher加載圖像非常簡單，請看以下內容：

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

Answer 3

我想到了。 除了var imageCache = String：UIImage外，我將其他所有東西都塞進了Custom UIImageView類中。 我離開了那個全球。 一切正常。

因此，它不是UIImageView的擴展，而是它自己的自定義類。

因此，使用loadImage（urlString：String）函數將所有UIImageView更改為CustomImageView。

例：

@IBOutlet弱var userImage：UIImageView！

改成

@IBOutlet弱var userImage：CustomImageView！

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()
    }
}

調用load方法的示例：

cell.userImage.loadImage(urlString: userImageUrl)