How to show parsed data with SwiftUI? - api

Question

I'm trying to show in a view parsed data from an API using SwiftUI.
I'm fetching correctly the data using this code:
import UIKit
class APIController: ObservableObject {
func apiCall() {
// URL
let url = URL(string: "https://geek-jokes.p.rapidapi.com/api?format=json")
guard url != nil else {
print("Error creating url object")
return
}
// URL Rquest
var request = URLRequest(url: url!, cachePolicy: .useProtocolCachePolicy, timeoutInterval: 10)
// Specify the header
let headers = [
"x-rapidapi-key": "d1363cbe66msh266920b6366eaacp1f87dfjsn050e3f8e58e2",
"x-rapidapi-host": "geek-jokes.p.rapidapi.com"
]
request.allHTTPHeaderFields = headers
// Specify the body
// let jsonObject = [
// "sign": "Aries"
// ] as [String:Any]
//
// do {
// let requestBody = try JSONSerialization.data(withJSONObject: jsonObject, options: .fragmentsAllowed)
//
// request.httpBody = requestBody
// }
// catch {
// print("Error creating the data object from json")
// }
// Set the request type
request.httpMethod = "GET"
// Get the URLSession
let session = URLSession.shared
// Create the data task
let dataTask = session.dataTask(with: request) { data, response, error in
// Check for errors
if error == nil && data != nil {
// Try to parse out the JSON data
let decoder = JSONDecoder()
do {
let jokesData = try decoder.decode(JokesData.self, from: data!)
print(jokesData)
}
catch {
print("Error in JSON parsing")
}
// Try to print out the JSON data
// do {
// let dictionary = try JSONSerialization.jsonObject(with: data!, options: .mutableContainers) as? [String:Any]
// print(dictionary)
//
// }
// catch {
// print("Error parsing response data")
// }
}
}
// Fire off the data task
dataTask.resume()
}
}
Then I'm not sure if the data is correctly imported in JokesData.swift
import foundation
struct JokesData: Codable {
var joke:String = ""
}
And when I try to load the data in JokesView.swift, nothing appear :(
import SwiftUI
struct JokesView: View {
var jokesData: JokesData
#StateObject var viewRouter: ViewRouter
var body: some View {
Text(jokesData.joke)
.foregroundColor(.black)
}
}
If someone has an idea of what I did wrong, it would be very helpful.

Answer 1

In APIController add a property
#Published var jokesData = JokesData()
Replace the do - catch block in the completion handler with
do {
let jokesData = try decoder.decode(JokesData.self, from: data!)
print(jokesData)
DispatchQueue.main.async {
self.jokesData = jokesData
}
}
catch {
print(error)
}
it assigns the received data to the publishing jokesData property.
In the view create a #StateObject of the controller, in the onAppear modifier load the data, the view will be updated automatically.
import SwiftUI
struct JokesView: View {
#StateObject var apiController = APIController()
var body: some View {
Text(apiController.jokesData.joke)
.foregroundColor(.black)
.onAppear() {
apiController.apiCall()
}
}
}