こんにちは！🐶
今まではデータの送信・読み取りについて学んできましたが、今回はデータの更新について学んできます！
下準備
今回は前回作ったユーザー情報の編集をすることでデータの更新について学んでいきます！そのために、まずユーザープロフィール画面を作りましょう！👇新しくViewContorollerを配置し、TabBarControllerにつないでください！
スクリーンショット 2021-06-09 14.47.01.png
データを読み取ろう!
ユーザープロフィールを作る為に、まず、ユーザー情報を読み取りそれプロフィール画面に入れてあげなければなりません。
ここは、もう今までのおさらいですね！こんな感じでプロフィール画面にコードを書いていきましょう！
import UIKit
import Firebase
import FirebaseAuth
import Nuke
class ProfileViewController: UIViewController {
@IBOutlet weak var userImageView: UIImageView!
@IBOutlet weak var userNameLabel: UILabel!
@IBOutlet weak var introductionTextView: UITextView!
//Firestoreのデータベース
let db = Firestore.firestore()
override func viewDidLoad() {
super.viewDidLoad()
loadUser()
}
//ユーザー情報読み取り
func loadUser() {
//Userコレクションから自分のユーザーIDと一致するドキュメントを持ってくる
db.collection("Users").document(Auth.auth().currentUser!.uid).getDocument { (result, error) in
if error != nil {
print("ユーザー情報取得失敗")
}
print("ユーザー情報取得成功")
let data = result?.data()
let user = User(userName: data!["userName"] as! String, profileImage: data!["profileImage"] as! String, introduction: data!["introduction"] as! String)
//ユーザーネーム設定
self.userNameLabel.text = user.userName
//自己紹介文があったら、introductionTextViewにテキストを入れる
if user.introduction != "" {
self.introductionTextView.text = user.introduction
}
//ユーザー画像が設定されていたらNukeを使って、ユーザー画像を入れる
if user.profileImage != "" {
Nuke.loadImage(with: user.profileImage as! ImageRequestConvertible, into: self.userImageView)
}
}
}
}
はい！まだ自己紹介分とユーザー画像は設定していないので、出ないですが、ユーザーネームは読み取れていますね！
では、このユーザー画像も設定できるように、データを更新していきましょう！
＃データを更新しよう！
ではユーザー情報を編集できる画面を作りましょう。
ユーザープロフィールの編集ボタンから編集画面に繋げてください！
ではユーザープロフィール編集のクラスを作り、これも今までと一緒でまず、データを読み取るコードを書いてあげましょう！
import UIKit
import Firebase
import FirebaseAuth
import Nuke
class EditProfileViewController: UIViewController {
@IBOutlet weak var userImageView: UIImageView!
@IBOutlet weak var userNameTextField: UITextField!
@IBOutlet weak var introductionTextView: UITextView!
let db = Firestore.firestore()
override func viewDidLoad() {
super.viewDidLoad()
loadUser()
}
//ユーザー情報読み取り
func loadUser() {
//Userコレクションから自分のユーザーIDと一致するドキュメントを持ってくる
db.collection("Users").document(Auth.auth().currentUser!.uid).getDocument { (result, error) in
if error != nil {
print("ユーザー情報取得失敗")
}
print("ユーザー情報取得成功")
let data = result?.data()
let user = User(userName: data!["userName"] as! String, profileImage: data!["profileImage"] as! String, introduction: data!["introduction"] as! String)
//ユーザーネーム設定
self.userNameTextField.text = user.userName
//自己紹介文があったら、introductionTextViewにテキストを入れる
if user.introduction != "" {
self.introductionTextView.text = user.introduction
}
//ユーザー画像が設定されていたらNukeを使って、ユーザー画像を入れる
if user.profileImage != "" {
let userImageUrl = URL(string:user.profileImage)
Nuke.loadImage(with: userImageUrl as! ImageRequestConvertible, into: self.userImageView)
}
}
}
//編集ボタン
@IBAction func EditButton(_ sender: Any) {
}
}
では、更新ボタンを押すと、記入したものが更新されるコードを書いていきます！コードは以下になります👇
見てもらったらわかるとおり、ほとんど投稿画面と一緒です！笑
違うポイントはここですね！👇
func saveUserProfile(profileImageUrl:String){
//userNameTextFieldにテキストが入っていたら
guard let text = userNameTextField.text else {return}
db.collection("Users").document(Auth.auth().currentUser!.uid).updateData(["userName" :userNameTextField.text,"profileImage":profileImageUrl,"introduction":introductionTextView.text]) { (error) in
if error != nil {
print("ユーザー情報更新失敗")
} else {
print("ユーザー情報更新成功")
self.dismiss(animated: true, completion: nil)
}
} }
普通にデータを送信するときは、db.collection("Users").document(Auth.auth().currentUser!.uid).addDataになりますが、このaddDateのところが、updeteDataになっています！
このupdeteDataがFirestoreの更新するコードになります！
では実際に、データを更新してみましょう！
今の画面はこちら。
編集画面で、編集していき、更新ボタンを押して、プロフィール画面を見てみましょう！
はい！しっかりデータが更新されプロフィールに反映されてますね！こんな感じで、データの更新はあっという間に出来ちゃいました！
皆さんは、以前にデータの送信・読み取りをやってきたので、変わるところはほどんどなかったですね！
お疲れ様でした！
今回は、データの更新について学んできました！
次回は、いいね機能を実装していきたいと思います！