SwiftUI: How can I get server data to display? - swiftui

Question

Scenario: Accessing data (of variable size) from a server and display it. In this case, an array of countries.
Server access should be called once(1) upon entering this View (or before).
Observation: I can see the data via debugger & print statements within the publisher.
Problem: Data doesn't display within View.
The following is the ENTIRE code (reduced to a simple request for an array of countries via playground).
Please feel free to cut/paste into playground.
It should run as expected, but doesn't display any data.
Solution?
import Combine
import SwiftUI
import PlaygroundSupport
// ---------------------------------------------------------------------------
var cancellables: Set<AnyCancellable> = []
struct VaccinesDataView: View {
#State private var appleData: [String]?
#StateObject var appleCountries = AppleCountries()
var body: some View {
Form {
Section(header: VStack(alignment: .leading) {
Text("Apple Data")
}) {
if let vacData = appleData {
ForEach(vacData, id: \.self) { source in
HStack {
Text(source)
.font(.title)
}
}
}
}
.navigationBarTitle("Vaccines", displayMode: .inline)
}.onAppear {
self.appleCountries.getData()
}
.navigationViewStyle(StackNavigationViewStyle())
}
}
// =====================================================================================================
class AppleCountries: ObservableObject {
#Published var appleData: [String]?
func getData() {
let appleURL = URL(string: "https://disease.sh/v3/covid-19/apple/countries")!
let remoteDataPublisher = URLSession.shared.dataTaskPublisher(for: appleURL)
.map(\.data)
.receive(on: DispatchQueue.main)
.decode(type: [String].self, decoder: JSONDecoder())
.print("Apples: ")
remoteDataPublisher
.eraseToAnyPublisher()
.sink(receiveCompletion: { completion in
switch completion {
case .finished:
print("Publisher Finished")
case let .failure(anError):
Swift.print("\nReceived error: ", anError)
}
}, receiveValue: { someValue in
self.appleData = someValue
print("appleData: \(String(describing: self.appleData))")
}).store(in: &cancellables)
}
}
PlaygroundPage.current.setLiveView(VaccinesDataView())
Hint: I notice REPEATED access to server, when I only want one (1).
The server access is via .onAppear() which is probably called multiple times.
Apples: : receive subscription: (Decode)
Apples: : request unlimited
Apples: : receive subscription: (Decode)
Apples: : request unlimited
Apples: : receive subscription: (Decode)
Apples: : request unlimited
Apples: : receive subscription: (Decode)
Apples: : request unlimited
Apples: : receive value: (["Albania", "Argentina", "Australia", "Austria", "Belgium", "Brazil", "Bulgaria", "Cambodia", "Canada", "Chile", "Colombia", "Croatia", "Czechia", "Denmark", "Egypt", "Estonia", "Finland", "France", "Germany", "Greece", "Hong Kong", "Hungary", "Iceland", "India", "Indonesia", "Ireland", "Israel", "Italy", "Japan", "Latvia", "Lithuania", "Luxembourg", "Macao", "Malaysia", "Mexico", "Morocco", "Netherlands", "New Zealand", "Norway", "Philippines", "Poland", "Portugal", "S. Korea", "Romania", "Russia", "Saudi Arabia", "Serbia", "Singapore", "Slovakia", "Slovenia", "South Africa", "Spain", "Sweden", "Switzerland", "Taiwan", "Thailand", "Turkey", "Ukraine", "UAE", "UK", "USA", "Uruguay", "Vietnam"])
appleData: Optional(["Albania", "Argentina", "Australia", "Austria", "Belgium", "Brazil", "Bulgaria", "Cambodia", "Canada", "Chile", "Colombia", "Croatia", "Czechia", "Denmark", "Egypt", "Estonia", "Finland", "France", "Germany", "Greece", "Hong Kong", "Hungary", "Iceland", "India", "Indonesia", "Ireland", "Israel", "Italy", "Japan", "Latvia", "Lithuania", "Luxembourg", "Macao", "Malaysia", "Mexico", "Morocco", "Netherlands", "New Zealand", "Norway", "Philippines", "Poland", "Portugal", "S. Korea", "Romania", "Russia", "Saudi Arabia", "Serbia", "Singapore", "Slovakia", "Slovenia", "South Africa", "Spain", "Sweden", "Switzerland", "Taiwan", "Thailand", "Turkey", "Ukraine", "UAE", "UK", "USA", "Uruguay", "Vietnam"])
Apples: : receive finished
Publisher Finished
Apples: : receive value: (["Albania", "Argentina", "Australia", "Austria", "Belgium", "Brazil", "Bulgaria", "Cambodia", "Canada", "Chile", "Colombia", "Croatia", "Czechia", "Denmark", "Egypt", "Estonia", "Finland", "France", "Germany", "Greece", "Hong Kong", "Hungary", "Iceland", "India", "Indonesia", "Ireland", "Israel", "Italy", "Japan", "Latvia", "Lithuania", "Luxembourg", "Macao", "Malaysia", "Mexico", "Morocco", "Netherlands", "New Zealand", "Norway", "Philippines", "Poland", "Portugal", "S. Korea", "Romania", "Russia", "Saudi Arabia", "Serbia", "Singapore", "Slovakia", "Slovenia", "South Africa", "Spain", "Sweden", "Switzerland", "Taiwan", "Thailand", "Turkey", "Ukraine", "UAE", "UK", "USA", "Uruguay", "Vietnam"])
appleData: Optional(["Albania", "Argentina", "Australia", "Austria", "Belgium", "Brazil", "Bulgaria", "Cambodia", "Canada", "Chile", "Colombia", "Croatia", "Czechia", "Denmark", "Egypt", "Estonia", "Finland", "France", "Germany", "Greece", "Hong Kong", "Hungary", "Iceland", "India", "Indonesia", "Ireland", "Israel", "Italy", "Japan", "Latvia", "Lithuania", "Luxembourg", "Macao", "Malaysia", "Mexico", "Morocco", "Netherlands", "New Zealand", "Norway", "Philippines", "Poland", "Portugal", "S. Korea", "Romania", "Russia", "Saudi Arabia", "Serbia", "Singapore", "Slovakia", "Slovenia", "South Africa", "Spain", "Sweden", "Switzerland", "Taiwan", "Thailand", "Turkey", "Ukraine", "UAE", "UK", "USA", "Uruguay", "Vietnam"])
Apples: : receive finished
Publisher Finished
...
...
...

Answer 1

You don't need extra state appleData - it is not filled - use appleCountries directly as below.
Tested with Xcode 12.1 / iOS 14.1
struct VaccinesDataView: View {
#StateObject var appleCountries = AppleCountries()
var body: some View {
Form {
Section(header: VStack(alignment: .leading) {
Text("Apple Data")
}) {
if let vacData = appleCountries.appleData { // !!
ForEach(vacData, id: \.self) { source in
HStack {
Text(source)
.font(.title)
}.onAppear {
appleCountries.getData()
}
}
}
}
.navigationBarTitle("Vaccines", displayMode: .inline)
}.onAppear {
self.appleCountries.getData()
}
.navigationViewStyle(StackNavigationViewStyle())
}
}