Swift Practice # 149 SwiftUI 取得網路API JSON資料

Dogpa Chen
Apr 28, 2022

上一篇研究了關於Segmented Controller在SwiftUi的實踐方法。

而這篇則要回到JSON的格式解析上研究如何透過SwiftUI串接網路API並解析JSON格式。

過往的練習串接過許多JSON,所以先透過過往有使用過的API練習,先嘗試使用過往第80篇文章的iTunes歌手API來當作練習。

建立JSON解析Struct:

因為過往已經有了這個Struct,直接拿來使用,而唯一要注意的是需要遵從Hashable的Protocol,關於Hashable下方連結可以點入去理解。

建立JSONViewModel:

不知道該怎麼取ViewModel的名字先暫且取作JSONViewModel,在這裡建立兩個@Published的值來寫入JSON資料與歌手的名稱給View使用。再建立一個func來隨機取得歌手名稱放入在API當中去取得歌手的JSON資料。

顯示照片的AlbumImageView:

建立AlbumImageView是為了讓顯示照片的Image能透過照片的網址透過URL取得Data後顯示。

ContentView:

在這裡面透過List與Foreach來顯示照片,雖然網路大神13說可以的話List不要用,但是就目前來說先透過List來顯示,另外透過一個Button按鈕可以重新再取得隨機歌手的照片。

執行狀況:

心得與發現:

大致上有60%感覺跟UIKit差不多,只在於foreach更快速的設定每一格資訊內的資訊,不像UIKit還另外要拉一個view來處理內容的狀況。又多學到一個內容,持續加油!!

學習資源:

https://ithelp.ithome.com.tw/articles/10235752

--

--