Access first item in an array decoded from an API - arrays

Question

Hello everybody and Happy Holiday!
I am a SwiftUI novice just starting out and playing with APIs. I managed to get used to decoding API but I encounter an issue when I try to access the first item in the array. I am using SwiftyJSON to decode. I tried accessing the index 0 but the build fails with Error: Index Out of Range
Any tip would be extremely helpful especially for a novice like me.
Thank you in advance!
Model
struct dataType: Identifiable {
var id: String
var title: String
var desc: String
var url: String
var image: String
Decoding the JSON
class getData: ObservableObject {
#Published var datas = [dataType]()
init() {
let source = "https://newsapi.org/v2/top-headlines?country=ro&apiKey=c602e42864e148dea1144f1f55255888"
let url = URL(string: source)!
let session = URLSession(configuration: .default)
session.dataTask(with: url) { (data, _, err) in
if err != nil {
print((err?.localizedDescription)!)
return
}
let json = try! JSON(data: data!)
for i in json["articles"]{
let title = i.1["title"].stringValue
let description = i.1["description"].stringValue
let url = i.1["url"].stringValue
let image = i.1["urlToImage"].stringValue
let id = i.1["publishedAt"].stringValue
DispatchQueue.main.async {
self.datas.append(dataType(id: id, title: title, desc: description, url: url, image: image))
}
}
}.resume()
}
And finally, the view
struct ContentView: View {
#ObservedObject var list = getData()
var body: some View {
VStack {
WebImage(url: URL(string: list.datas[0].title), options: .highPriority, context: nil)
.resizable()
.frame(width:400, height:250)
NavigationView {
List(list.datas){i in
NavigationLink(destination: webView(url: i.url).navigationBarTitle("", displayMode: .inline))
{
HStack {
VStack(alignment: .leading, spacing: 10) {
Text(i.title).fontWeight(.heavy)
Text(i.desc)
.lineLimit(3)
}
if i.image != "" {
WebImage(url: URL(string:i.image), options: .highPriority, context: nil)
.resizable()
.frame(width: 110, height: 135)
.cornerRadius(20)
}
}.padding(.vertical, 15)
}
}.navigationBarTitle("Noutati")
}
}
}

Answer 1

URLSession executes dataTask asynchronously, so at the start there is no data yet, ie. datas is empty, so trying to get first (below datas[0]) element of empty array result in exception (which you see)
WebImage(url: URL(string: list.datas[0].title), options: .highPriority, context: nil)
.resizable()
.frame(width:400, height:250)
instead you need to show some stub view till data got loaded, like below
if list.data.isEmpty {
Text("Loading...")
} else {
WebImage(url: URL(string: list.datas[0].title), options: .highPriority, context: nil)
.resizable()
.frame(width:400, height:250)
}