タイムライン画面から詳細画面へのデータの反映（Firebase）ができません

Question

前提・実現したいこと

Xcode11.3
Swift5
macOSMojave10.14.6

フェイスブックのコメントボタンを押した時のような、タイムライン画面から個別の画面に遷移し、タイムラインで表示されていた画像やテキストなどが遷移先でも表示されるようにしたい

タイムライン画面ではUItableViewを使い、それぞれのセルはxibファイルを使い、データベースはFirebaseを使ってます。
遷移先にはUIView,UIButton,UILabelがあります。

発生している問題・エラーメッセージ

遷移先で画像やテキストが反映されない
didSelectRowAtでタップされたセル番号が判別されているようですが、その判別されたセル番号のデータを取得し、表示させることができません。

該当のソースコード

遷移元

import UIKit
import Firebase

class HomeViewController: UIViewController, UITableViewDataSource, UITableViewDelegate {
    
    @IBOutlet weak var tableView: UITableView!
    
    var postArray: [PostData] = []
    
    // DatabaseのobserveEventの登録状態を表す
    var observing = false
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        tableView.delegate = self
        tableView.dataSource = self
              
        let nib = UINib(nibName: "PostTableViewCell", bundle: nil)
        tableView.register(nib, forCellReuseIdentifier: "Cell")
        
        // テーブル行の高さをAutoLayoutで自動調整する
        tableView.rowHeight = UITableView.automaticDimension
        // テーブル行の高さの概算値を設定しておく
        // 高さ概算値 = 「縦横比1:1のUIImageViewの高さ(=画面幅)」+「いいねボタン、キャプションラベル、その他余白の高さの合計概算(=100pt)」
        tableView.estimatedRowHeight = UIScreen.main.bounds.width + 100
    }
    
    override func viewWillAppear(_ animated: Bool) {
        super.viewWillAppear(animated)
        print("DEBUG_PRINT: viewWillAppear")
        
        if Auth.auth().currentUser != nil {
            if self.observing == false {
                // 要素が追加されたらpostArrayに追加してTableViewを再表示する
                let postsRef = Database.database().reference().child(Const.PostPath)
                postsRef.observe(.childAdded, with: { snapshot in
                    print("DEBUG_PRINT: .childAddedイベントが発生しました。")
                    
                    // PostDataクラスを生成して受け取ったデータを設定する
                    if let uid = Auth.auth().currentUser?.uid {
                        let postData = PostData(snapshot: snapshot, myId: uid)
                        self.postArray.insert(postData, at: 0)
                        
                        // TableViewを再表示する
                        self.tableView.reloadData()
                    }
                })
                // 要素が変更されたら該当のデータをpostArrayから一度削除した後に新しいデータを追加してTableViewを再表示する
                postsRef.observe(.childChanged, with: { snapshot in
                    print("DEBUG_PRINT: .childChangedイベントが発生しました。")
                    
                    if let uid = Auth.auth().currentUser?.uid {
                        // PostDataクラスを生成して受け取ったデータを設定する
                        let postData = PostData(snapshot: snapshot, myId: uid)
                        
                        // 保持している配列からidが同じものを探す
                        var index: Int = 0
                        for post in self.postArray {
                            if post.id == postData.id {
                                index = self.postArray.firstIndex(of: post)!
                                break
                            }
                        }
                        
                        // 差し替えるため一度削除する
                        self.postArray.remove(at: index)
                        
                        // 削除したところに更新済みのデータを追加する
                        self.postArray.insert(postData, at: index)
                        
                        // TableViewを再表示する
                        self.tableView.reloadData()
                    }
                })
                
                // DatabaseのobserveEventが上記コードにより登録されたため
                // trueとする
                observing = true
            }
        } else {
            if observing == true {
                // ログアウトを検出したら、一旦テーブルをクリアしてオブザーバーを削除する。
                // テーブルをクリアする
                postArray = []
                tableView.reloadData()
                // オブザーバーを削除する
                let postsRef = Database.database().reference().child(Const.PostPath)
                postsRef.removeAllObservers()
                
                // DatabaseのobserveEventが上記コードにより解除されたため
                // falseとする
                observing = false
            }
        }
    }
    
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return postArray.count
    }
    
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        // セルを取得してデータを設定する
        let cell = tableView.dequeueReusableCell(withIdentifier: "Cell", for: indexPath) as! PostTableViewCell
        cell.setPostData(postArray[indexPath.row])
        
        // セル内のボタンのアクションをソースコードで設定する
        cell.likeButton.addTarget(self, action:#selector(handleButton(_:forEvent:)), for: .touchUpInside)
        
        return cell
    }
    //セルをタップしたら...
    func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
    
        // タップされたセルの行番号を出力
        print("(indexPath.row)番目の行が選択されました。")
        //セルの選択を解除
        tableView.deselectRow(at: indexPath, animated: true)
        //記事画面へ遷移
        performSegue(withIdentifier: "Article", sender: nil)
    }
    
    // セル内のボタンがタップされた時に呼ばれるメソッド
    @objc func handleButton(_ sender: UIButton, forEvent event: UIEvent) {
        print("DEBUG_PRINT: likeボタンがタップされました。")
        
        // タップされたセルのインデックスを求める
        let touch = event.allTouches?.first
        let point = touch!.location(in: self.tableView)
        let indexPath = tableView.indexPathForRow(at: point)
        
        // 配列からタップされたインデックスのデータを取り出す
        let postData = postArray[indexPath!.row]
        
        // Firebaseに保存するデータの準備
        if let uid = Auth.auth().currentUser?.uid {
            if postData.isLiked {
                // すでにいいねをしていた場合はいいねを解除するためIDを取り除く
                var index = -1
                for likeId in postData.likes {
                    if likeId == uid {
                        // 削除するためにインデックスを保持しておく
                        index = postData.likes.firstIndex(of: likeId)!
                        break
                    }
                }
                postData.likes.remove(at: index)
            } else {
                postData.likes.append(uid)
            }
            
            // 増えたlikesをFirebaseに保存する
            let postRef = Database.database().reference().child(Const.PostPath).child(postData.id!)
            let likes = ["likes": postData.likes]
            postRef.updateChildValues(likes)
            
        }
    }
}

遷移先

import UIKit
import Firebase
import SVProgressHUD

class ArticleViewController: UIViewController,UITextFieldDelegate {

    @IBOutlet weak var ArticleImage: UIImageView!
    @IBOutlet weak var ArticleLabel: UILabel!
    @IBOutlet weak var ArticleButton: UIButton!
    @IBOutlet weak var ArticleLilkeCount: UILabel!
    @IBOutlet weak var CommentLabel: UILabel!
    @IBOutlet weak var CommentTextField: UITextField!
     
    
    override func viewDidLoad() {
        super.viewDidLoad()
        self.CommentTextField.delegate = self
        CommentTextField.returnKeyType = .done
        
        
    }
    
    func setPostData(_ postData: PostData) {
        //イメージ画像
        self.ArticleImage.image = postData.image
        //キャプションのテキスト
        self.ArticleLabel.text = "(postData.name!) : (postData.caption!)"
        //いいねの数
        let likeNumber = postData.likes.count
        ArticleLilkeCount.text = "(likeNumber)"
//        //日付
//        let formatter = DateFormatter()
//        formatter.dateFormat = "yyyy-MM-dd HH:mm"
//        let dateString = formatter.string(from: postData.date!)
//        self.dateLabel.text = dateString
        //いいねボタン
        if postData.isLiked {
            let buttonImage = UIImage(named: "like_exist")
            self.ArticleButton.setImage(buttonImage, for: .normal)
        } else {
            let buttonImage = UIImage(named: "like_none")
            self.ArticleButton.setImage(buttonImage, for: .normal)
        }
        
    }
    
    
    //キーボードを閉じる
    @IBAction func textField(_ sender: Any) {
        CommentTextField.text = (sender as AnyObject).text
    }
    //コメント投稿ボタン
    @IBAction func CommentButton(_ sender: UIButton) {
        
    }
}

試したこと

様々なネット上のやり方を試しましたが、うまくいきせん。（そもそもネット上で見つけられませんでした）

Answer 1

タップされたCellのindexPathをキーにして、タップされたCellに該当するデータを抽出し、それを画面遷移する際に、遷移先に渡して、遷移先で表示してみてください。

データの取得はcellForRowAtのなかでindexPathをキーにしてcellにデータを渡している部分を参考にしてください。

遷移&値渡しは↓な感じで

swiftにおける値渡しの方法の一部をご紹介

-- 追記 --

・渡すデータの取得
let postData = postArray[indexPath.row]

・渡し方、
ArticleViewControllerのfunc setPostData(_ postData: PostData)を利用するのかと思うのですが、遷移先のVC(avc)を生成した時点ではavc.setPostData(postData)できないと思うので、動かなかったら、しょうがないので、presentのcompletionで渡してあげてみてください。

遷移先での表示についてなので、遷移先で編集したデータの保存については別途考えてください。

-- 追記 --

画面遷移ができているという前提で、

let postData = postArray[indexPah.row]

let nextVC
     = self.storyboard?
        .instantiateViewController(withIdentifier: "Article") as! ArticleViewController

self.present(nextVC, animated: true, completion: {
    nextVC.setPostData(postData)
})

これでうごくんじゃないかな？

なんでcompletionで渡してるかは、遷移先にsetPost(_:)があり、postDataを受ける変数がないから。
nilになるとかは、viewControllerのライフサイルとかで調べてみてください。

Comments

[iOS25535009]

ありがとうございます。
なんだか違うような気がします。
https://gyazo.com/fdd4ffdcb9444547930ed67778269d65
https://gyazo.com/51a1c1f92d818871c082be887d3e4b85

[iOS25535009]

遷移先でのindexPathの使い方がわかりません。

[iOS25535009]

このように書いてタップしてもピクリともしません。
```
func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath,_ postData: PostData) {

// タップされたセルの行番号を出力
print("(indexPath.row)番目の行が選択されました。")

//記事画面へ遷移
let nextVC = self.storyboard?.instantiateViewController(withIdentifier: "Article") as! ArticleViewController
//イメージ画像
nextVC.ArticleImage.image = postData.image
//キャプションのテキスト
nextVC.ArticleLabel.text = "(postData.name!) : (postData.caption!)"
//いいねの数
let likeNumber = postData.likes.count
nextVC.ArticleLilkeCount.text = "(likeNumber)"
//いいねボタン
if postData.isLiked {
let buttonImage = UIImage(named: "like_exist")
nextVC.ArticleButton.setImage(buttonImage, for: .normal)
} else {
let buttonImage = UIImage(named: "like_none")
nextVC.ArticleButton.setImage(buttonImage, for: .normal)
}

self.navigationController?.popViewController(animated: true)

//セルの選択を解除
tableView.deselectRow(at: indexPath, animated: true)

}
```
self.present(nextVC, animated: true, completion: nil)をつけても同様です。

ご教授願います。

[退会済みユーザー]

質問文では、Sequeで遷移してたとおもいますが？今度はナビゲーションバー？
何がピクリとも動かないのかわかりませんが、もしかして、できないのは、値を渡すことでは無く画面遷移ではないですか？

[iOS25535009]

失礼しました。色々いじってごちゃつきました。
セグエでいきます。

下記のように書いていますが、
func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {

// タップされたセルの行番号を出力
print("(indexPath.row)番目の行が選択されました。")

let postData = postArray[indexPath.row]
//記事画面へ遷移
let nextVC = self.storyboard?.instantiateViewController(withIdentifier: "Article") as! ArticleViewController
//イメージ画像
nextVC.ArticleImage.image = postData.image
//キャプションのテキスト
nextVC.ArticleLabel.text = "(postData.name!) : (postData.caption!)"
//いいねの数
let likeNumber = postData.likes.count
nextVC.ArticleLilkeCount.text = "(likeNumber)"
//いいねボタン
if postData.isLiked {
let buttonImage = UIImage(named: "like_exist")
nextVC.ArticleButton.setImage(buttonImage, for: .normal)
} else {
let buttonImage = UIImage(named: "like_none")
nextVC.ArticleButton.setImage(buttonImage, for: .normal)
}

self.present(nextVC, animated: true, completion: nil)

//セルの選択を解除
tableView.deselectRow(at: indexPath, animated: true)
}
タップすると、Thread 1: Fatal error: Unexpectedly found nil while implicitly unwrapping an Optional valueというnilを検知されました。
このエラーのため先に進めません。どの部分がそうさせるのでしょうか？

[退会済みユーザー]

画面遷移は実現できているのでしょうか？
画面遷移ができるかわからない場合は、値渡しのコードをコメントアウトして、遷移先を表示できるか試してください。
遷移ができないなら、コード全体とStoryboardを載せてください。
画面遷移ができているなら、回答を読んで書いてあることを試してみてください。

[iOS25535009]

ありがとうございます。コメントアウトで画面遷移はなります。
一通り試しましたが、全てダメでした。
ちなみに「completionで渡す」とはどういうことでしょうか？
ご教授願います。

[退会済みユーザー]

> 一通り試しましたが、全てダメでした。
そう書かれても、申し訳ないんですが、何が一通りで、何が全てダメだかわかりません。

[iOS25535009]

completion: {nextVC.setPostData(postData)}で表示できました。ありがとうございました。