Swift Practice # 150 Firestore 資料存取
上一篇研究了SwiftUI取得網路API資料的方法,慢慢理解之前在UIKit的畫面在SwiftUI該如何顯示。
這篇則要練習SwiftUI與Firestore,因為下一個side project預計會透過Firestore當作資料庫,所以順帶重新理解一下該如何實現。
這篇將透過Firebase進行資料的新增/刪除/修改/讀取,
前置:
如何透過Cocoapods安裝套件與Firebase互動並取得plist,可以參照我之前的文章,看到Auth功能前就好。另外也可以透過SPM快速安裝套件。
Swift Practice # 107 Firebase初探 Cocoapods安裝與環境設定
上一篇完成了User的地理位置授權與追蹤,大致理解外送平台及Uber的地理顯示方式。
medium.com
Firestore建立第一筆資料:
點選左側Firestore Database後點選Create database。
透過test mode建立資料後按下Next。
資料儲存位址我選擇asia-east1,也就是Google彰濱,這個選好後不能再更動,所以我選擇最近的位置,接著按下右下角Enable。
接著點選Start collection。
輸入collection ID (Mission)後按下Next。
點擊Auto ID讓系統自動產出ID。
Field輸入預設的命名(跟後續JSON有關),Value則填入想填的資料。
建立好後可以看到目前的資料已經產生出一筆。
接下來就準備透過程式碼來完成讀取/新增/修改/刪除/更新
1.Firestore Model:
透過這個Model來對應Firestore內的資料結構。
2.FirestoreViewModel:
將Firestore讀取到的資料以及讀取/新增/刪除/更新的function集中在FirestoreViewModel內。
3.NewMissionView:
在此View將TextField的內容上傳到Firestore,上傳後返回到讀取資料的View。
4.EditView:
點選編輯後出現的View,將原本的Mission字串透過Binding傳給TextField直接顯示,送出編輯後返回讀取資料的View。
5.ContentView:
顯示讀取後的Firestore data,透過Navigation Item Bar 製造Button跳到建立新Mission的View,List內可透過左滑出現編輯或是刪除的Button,編輯會跳到編輯的View,刪除則直接刪除該Mission。
6
6. 專案名稱APP.siwft加入Firebase.cinfigure使用Firebase的功能。
畫面測試:
讀取Mission:
新增Mission:
編輯Mission:
刪除Mission:
大致上透過SwiftUI與Firestore來完成資料的存取,在自己的side project應該不會全部使用,但還是當作一個練習做出基本的功能。也算是讓自己多學習一些東西。持續加油!!