rxswift的雙向綁定


將值域與控件域一同提升為rx的monand域,然后進行綁定。

類型提升。

 

在之前的文章樣例中,所有的綁定都是單向的。但有時候我們需要實現雙向綁定。比如將控件的某個屬性值與 ViewModel里的某個 Subject屬性進行雙向綁定:

  • 這樣當 ViewModel里的值發生改變時,可以同步反映到控件上。
  • 而如果對控件值做修改,ViewModel那邊值同時也會發生變化。

一、簡單的雙向綁定

1,效果圖

(1)頁面上方是一個文本輸入框,用於填寫用戶名。它與 VM里的 username屬性做雙向綁定。

(2)下方的文本標簽會根據用戶名顯示對應的用戶信息。(只有 hangge顯示管理員,其它都是訪客)

 
 

 

 
 

2,樣例代碼

(1)首先定義一個 VM,代碼如下:

import RxSwift struct UserViewModel { //用戶名 let username = Variable("guest") //用戶信息 lazy var userinfo = { return self.username.asObservable() .map{ $0 == "hangge" ? "您是管理員" : "您是普通訪客" } .share(replay: 1) }() } 

(2)頁面代碼如下(高亮部分為 textfield與 VM的雙向綁定):

import UIKit import RxSwift import RxCocoa class ViewController: UIViewController { @IBOutlet weak var textField: UITextField! @IBOutlet weak var label: UILabel! var userVM = UserViewModel() let disposeBag = DisposeBag() override func viewDidLoad() { //將用戶名與textField做雙向綁定 userVM.username.asObservable().bind(to: textField.rx.text).disposed(by: disposeBag) textField.rx.text.orEmpty.bind(to: userVM.username).disposed(by: disposeBag) //將用戶信息綁定到label上 userVM.userinfo.bind(to: label.rx.text).disposed(by: disposeBag) } } 

二、自定義雙向綁定操作符(operator)

1,RxSwift 自帶的雙向綁定操作符

(1)如果經常進行雙向綁定的話,最好還是自定義一個 operator方便使用。

(2)好在 RxSwift項目文件夾中已經有個現成的(Operators.swift),我們將它復制到我們項目中即可使用。當然如我們想自己寫一些其它的雙向綁定 operator也可以參考它。

 
 

2,使用樣例

雙向綁定操作符是:<->。我們修改上面樣例,可以發現代碼精簡了許多。

import UIKit import RxSwift import RxCocoa class ViewController: UIViewController { @IBOutlet weak var textField: UITextField! @IBOutlet weak var label: UILabel! var userVM = UserViewModel() let disposeBag = DisposeBag() override func viewDidLoad() { //將用戶名與textField做雙向綁定 _ = self.textField.rx.textInput <-> self.userVM.username //將用戶信息綁定到label上 userVM.userinfo.bind(to: label.rx.text).disposed(by: disposeBag) } } 

RxSwift使用詳解系列
原文出自:www.hangge.com轉載請保留原文鏈接



作者:八級大狂風AM
鏈接:https://www.jianshu.com/p/39fb6a65ec91
來源:簡書
簡書著作權歸作者所有,任何形式的轉載都請聯系作者獲得授權並注明出處。
 
http://www.hangge.com/blog/cache/detail_1929.html


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM