SwiftUI Display JSON Data after GET Request - json

Question

I know this is classic concurrency problem, but I'm new to Swift and I feel like I've read through every relevant blog post about this. I know I'm fetching data correctly because it's showing up in my console, but I can't get it to display in my simulator. I believe it's because I'm displaying the UI before the data has loaded.
How can I display the data after I 100% fetched all the data. I'll add the relevant code and screenshots of the console. Sorry if this is a "basic" question.
Structs
struct Welcome: Decodable, Identifiable {
var id: Int?
var readings: [Reading]?
var include_maintenance_recommendations: Bool?
var pool_volume: Int?
var created_at, updated_at: String?
}
struct Reading: Decodable {
var analyte: String?
var value: String?
}
UI
var results = Welcome()
struct ContentView: View {
#State var res = Welcome()
var body: some View {
Text(results.created_at ?? "N/A")
.onAppear(){
fetchResults().getData {(res) in
self.res = res
}
}
}
}
Fetch Func
class fetchResults{
func getData(completion: #escaping (Welcome) -> ()){
print("Fetch")
let parameters = "{ \"pool_volume\": 10000, \"readings\": [ { \"analyte\": \"fc\", \"value\": 1.6 }, { \"analyte\": \"ph\", \"value\": 7.3 } ]}"
let postData = parameters.data(using: .utf8)
var request = URLRequest(url: URL(string: "https://www.biolabhydra.com/api/v3/water_tests")!,timeoutInterval: Double.infinity)
request.addValue("Basic ***********************", forHTTPHeaderField: "Authorization")
request.addValue("application/json", forHTTPHeaderField: "Content-Type")
request.addValue("csrftoken=***********************", forHTTPHeaderField: "Cookie")
request.httpMethod = "POST"
request.httpBody = postData
let task = URLSession.shared.dataTask(with: request) { (data, _, _) in
let resultList = try! JSONDecoder().decode(Welcome.self, from: data!)
print(" ")
print("ID: \(resultList.id ?? 111)")
print("VOLUME: \(resultList.pool_volume ?? 111)")
print("RECOMMENDATIONS: \(resultList.include_maintenance_recommendations ?? true)")
print("CREATD AT: \(resultList.created_at ?? "N/A")")
print("UPDATED AT: \(resultList.updated_at ?? "N/A")")
print("READINGS: \(String(describing: resultList.readings))")
print(" ")
print("SUCCESS: Got data - \(data! )")
}
task.resume()
}
}

Answer 1

Use local property instead of global variable
struct ContentView: View {
#State var res = Welcome()
var body: some View {
Text(res.created_at ?? "N/A") // << here !!
.onAppear(){
fetchResults().getData {(res) in
self.res = res
}
}
}
}
add callback after decoded data
let task = URLSession.shared.dataTask(with: request) { (data, _, _) in
let result = try! JSONDecoder().decode(Welcome.self, from: data!)
print(" ")
print("ID: \(resultList.id ?? 111)")
print("VOLUME: \(resultList.pool_volume ?? 111)")
print("RECOMMENDATIONS: \(resultList.include_maintenance_recommendations ?? true)")
print("CREATD AT: \(resultList.created_at ?? "N/A")")
print("UPDATED AT: \(resultList.updated_at ?? "N/A")")
print("READINGS: \(String(describing: resultList.readings))")
print(" ")
print("SUCCESS: Got data - \(data! )")
DispatchQueue.main.async {
completion(result) // << here !!
}
}