Cannot fetch data from Cloud Firestore in SwiftUI Button view - ios

Question

Why does this not work? There is data in Firestore, but it appears the block doesn't execute:
import SwiftUI
import FirebaseFirestore
struct ContentView: View {
var body: some View {
VStack{
Button(
action: {
print("Getting data...")
let db = Firestore.firestore().collection("menu")
let query = db.order(by: "name", descending: true)
query.getDocuments() { snapshot, err in
guard let snapshot = snapshot else {
return
}
print(snapshot)
for doc in snapshot.documents {
print(doc)
}
}
},
label: { Text("Click Me") }
)
}
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}

Answer 1

You shouldn't add data access logic to a button's action handler. Instead, extract data access logic into a view model (or even a repository), and then add a subscription on the view model's properties like this:
Hypothetical menu item data model:
struct MenuItem: Identifiable {
var id: String = UUID().uuidString
var title: String
}
View Model:
import Foundation
import FirebaseFirestore
class MenuItemsViewModel: ObservableObject {
#Published var menuItems = [MenuItem]()
private var db = Firestore.firestore()
func fetchData() {
db.collection("menuitems").addSnapshotListener { (querySnapshot, error) in
guard let documents = querySnapshot?.documents else {
print("No documents")
return
}
self.menuItems = documents.map { queryDocumentSnapshot -> MenuItem in
let data = queryDocumentSnapshot.data()
let title = data["title"] as? String ?? ""
return MenuItem(id: .init(), title: title)
}
}
}
}
And in your view:
struct MenuItemsListView: View {
#ObservedObject var viewModel = MenuItemsViewModel()
var body: some View {
NavigationView {
List(viewModel.menuItems) { menuItem in
VStack(alignment: .leading) {
Text(menuItem.title)
.font(.headline)
}
}
.navigationBarTitle("Menu")
.onAppear() { // (3)
self.viewModel.fetchData()
}
}
}
}
Data mapping can be further simplified by using Firestore's Codable support:
Here's how you need to update the model:
import FirebaseFirestoreSwift
struct MenuItem: Identifiable, Codable {
#DocumentID var id: String? = UUID().uuidString
var title: String
}
And here is the updated fetchData() method:
func fetchData() {
db.collection("menuitems").addSnapshotListener { (querySnapshot, error) in
guard let documents = querySnapshot?.documents else {
print("No documents")
return
}
self.menuItems = documents.compactMap { (queryDocumentSnapshot) -> MenuItem? in
return try? queryDocumentSnapshot.data(as: MenuItem.self)
}
}
}
If this doesn't work, check the log for any error messages (your security rules might be preventing you from reading data, for example).