[SwiftUI] Firebase databaseで、辞書を扱うことができない

Question

前提

firebase databaseに以下のようなデータを入力して、それをiOSアプリ上で使いたいと考えております。

実現したいこと

辞書の中にはString型やInt型、bool型が混在していますが、これらのデータをiOSアプリに呼び込んで使えるようにしたいです

該当のソースコード

import SwiftUI
import FirebaseCore
import Firebase

struct TestView: View
{
    @State var data = [String: Any]()
    func getData(){
        let ref = Database.database().reference()
        ref.child("data").getData { (error, snapshot) in
            if let error = error {
                print("Error getting data \(error)")
            }
            else if ((snapshot?.exists()) != nil) {
                guard let data = snapshot?.value as? [String: Any] else {
                    return
                }
                self.data = data
            }
            else {
                print("No data available")
            }
        }
        print(self.data)
    }
    var body: some View {
        Text("Hello, World!")
            .onAppear(){
                getData()
        }
    }
}

以上のコードより、辞書を呼び込んで、スマホの画面上に"Hello, World!"が表示されたタイミングで辞書がprintされることを意図したコードを書きました。しかし結果は、以下の画像の通り、辞書は空になってしまっている状態です、、

どなたかご教授よろしくお願いいたします🙇

Comments

[hoshi-takanori]

その data は、配列じゃなくて辞書 (Dictionary 型) になると思いますが…。

[yoshi88]

確かにそうでした、、
今辞書に変更して試してみたのですが、結果はかわらず空のままでした。。何がいけないかお分かりになったりしますでしょうか、、？

Answer 1

print(self.data) の内容が空で表示されてしまう原因は、
そのprintを実行している箇所がデータを受信する前に動作する箇所になっているからです。

getData メソッドは、データを受信したらクロージャを呼び出して受信データを
伝える仕様になっていますので、クロージャの処理の中で

self.data = data

を実施した直後(受信データをself.dataに格納した直後)に

print(self.data)

を実施すれば、受信データの内容が表示されると思います。

そして、 "Hello, World!" ではなく、 self.data の内容を Text で表示すれば、
self.data の変更を検知して画面が再描画されますので、受信したデータの内容が
画面に表示されると思います。

Comments

[yoshi88]

ご回答ありがとうございます！教えていただいた方法を用いてpirntすることができました！

もう一つ質問させていただきたいのですが、辞書の内容を表示させるために、「ForEach」を使って表示させようと思ったのですがうまくいかず、、画面表示の方法も具体的に教えていただくことは可能でしょうか？

お手隙の際にご確認よろしくお願いします🙇

[TakeOne]

配列でないものをなぜForEachで表示しようとしているのかよくわかりません。ForEachで表示すべきものなのかよく考えてください。解決しないなら、どのようなデータをどのように表示したいのか、きちんと別質問を立てて説明した方が良いと思います。

[yoshi88]

ご回答ありがとうございます！
そうさせて頂きます。