在從Firebase中檢索後在UITableView中隨機移動的圖片

Question

正如我的標題所述，我的tableView中的圖片轉移並且在滾動查看錶格視圖時未顯示在正確的帖子上。我停止滾動後，他們似乎又回到了原地。

我一直試圖做一個常理出以下條款：

new Firebase retrieve data and put on the tableview swift

retrieve image from Firebase storage to show on tableview swift

swift Firebase sort posts in tableview by date

但我無法弄清楚如何使圖片顯示更好。 這是我有：

import UIKit 
    import FirebaseAuth 
    import FirebaseDatabase 
    import FirebaseStorage 

    class MainFeedTableViewController: UITableViewController { 

     var posts = [Post]() 

     let alert = AlertsViewController() 

     var databaseRef: FIRDatabaseReference! { 
      return FIRDatabase.database().reference() 
     } 

     var storageRef: FIRStorage! { 
      return FIRStorage.storage() 
     } 

    override func viewDidLoad() { 
     super.viewDidLoad() 

     fetchPosts() 

    } 

    // populates the tableView with posts content in real time 
    private func fetchPosts(){ 

     let postRefs = databaseRef.child("posts") 

     postRefs.observe(.value) { (snapshot: FIRDataSnapshot) in 
      var newPost = [Post]() 

      for post in snapshot.children{ 
       let postObject = Post(snapshot: post as! FIRDataSnapshot) 
       newPost.insert(postObject, at: 0) 
      } 

      self.posts = newPost 
      self.tableView.reloadData() 
     } 

    } 

    // MARK: - Table view data source 

    override func numberOfSections(in tableView: UITableView) -> Int { 
     return 1 
    } 

    override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int { 
     return posts.count 
    } 

    override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { 

     let postsAtIndexPath = posts[indexPath.row] 

     if postsAtIndexPath.postWithImage == true { 

      let cell = tableView.dequeueReusableCell(withIdentifier: "postWithImage", for: indexPath) as! PostWithImageTableViewCell 

      let postUser = postsAtIndexPath.uid 

      let userRef = databaseRef.child("users/\(postUser!)") 

      userRef.observe(.value, with: { (snapshot) in 

       let user = User(snapshot: snapshot) 

       DispatchQueue.main.async(execute: { 
        cell.userRealNameLabel.text = user.name 
        cell.usernameLabel.text = "@" + user.username 
        cell.postTextView.text = postsAtIndexPath.postText 
        cell.timeStampLabel.text = postsAtIndexPath.date 
       }) 

       self.storageRef.reference(forURL: user.photoURL).data(withMaxSize: 1 * 1024 * 1024, completion: { (data, error) in 

        if error == nil{ 

         DispatchQueue.main.async(execute: { 
          if let data = data{ 
           cell.userProfilePicture.image = UIImage(data: data) 
          } 
         }) 

        } 
        else{ 

         print(error!.localizedDescription) 
        } 
       }) 

       self.storageRef.reference(forURL: postsAtIndexPath.postPictureURL).data(withMaxSize: 1 * 1024 * 1024, completion: { (data, error) in 

        if error == nil{ 

         DispatchQueue.main.async(execute: { 
          if let data = data{ 
           cell.postImage.image = UIImage(data: data) 

          } 
         }) 

        } 
        else{ 
         self.alert.displayAlert(alertTitle: "Error", alertMessage: error!.localizedDescription, fromController: self) 
        } 
       }) 

      }) { (error) in 
       self.alert.displayAlert(alertTitle: "Error", alertMessage: error.localizedDescription, fromController: self) 
      } 

      return cell 
     } 
     else{ 

      let cell = tableView.dequeueReusableCell(withIdentifier: "postWithText", for: indexPath) as! PostTableViewCell 

      let postUser = postsAtIndexPath.uid 

      let userRef = databaseRef.child("users/\(postUser!)") 

      userRef.observe(.value, with: { (snapshot) in 

       let user = User(snapshot: snapshot) 

       DispatchQueue.main.async(execute: { 
        cell.userRealNameLabel.text = user.name 
        cell.usernameLabel.text = "@" + user.username 
        cell.postTextView.text = postsAtIndexPath.postText 
        cell.timestampLabel.text = postsAtIndexPath.date 

       }) 

       self.storageRef.reference(forURL: user.photoURL).data(withMaxSize: 1 * 1024 * 1024, completion: { (data, error) in 

        if error == nil{ 

         DispatchQueue.main.async(execute: { 
          if let data = data{ 
           cell.userProfilePicture.image = UIImage(data: data) 
          } 
         }) 

        } 
        else{ 

         print(error!.localizedDescription) 
        } 
       }) 

      }) { (error) in 
       self.alert.displayAlert(alertTitle: "Error", alertMessage: error.localizedDescription, fromController: self) 
      } 

      return cell 
     } 

    } 

} 

我有一個很難究其原因，是因爲我想用戶的用戶名，姓名和個人資料圖片，當他們編輯自己的信息發生變化無處不在，實時。這就是爲什麼我基於帖子的用戶uid檢索用戶信息的原因。

什麼是更好的實現方式？

Answer 1

您必須覆蓋PostWithImageTableViewCell中的prepareForReuse函數。

例

override func prepareForReuse() { 
     super.prepareForReuse() 
     self.userProfilePicture.image = nil 
     //reset the rest of the values on your `UITableViewCell` subclass 
} 

編輯

由於再利用問題已經解決了，我想提出以下建議緩存框架，Kingfisher，更方便的圖像顯示體驗。

翠鳥有很大的延伸UIImageView，什麼會照顧你的緩存。

在這裏，你將如何使用它：

let url = URL(string: "https://domain.com/image.jpg")! 
imageView.kf.setImage(with: url) 

你只設置爲網址，你會唯一識別圖像資源，並且下載一次。這是一個cheat sheet，如何使用它。