RxSwift+MVVM项目实战-单分组UITableView的使用

简介: RxSwift+MVVM项目实战-单分组UITableView的使用

本文主要介绍利用RxSwift+MVVM实现只有一个分组的列表,实现效果如图(文末附源码):

Model

title:显示的标题

targetVC:点击每个item的时候,用作创建控制器以及跳转使用

class RootModel {
    var title: String?
    var targetVC: UIViewController.Type?
    init(title: String?, targetVC: UIViewController.Type) {
        self.title = title
        self.targetVC = targetVC
    }
}


RootCellViewModel

用于将标题绑定到cellUI控件上,以及获取跳转控制器

class RootCellViewModel: NSObject {
    var title = BehaviorRelay<String?>(value: nil)
    var targetVC = BehaviorRelay<UIViewController.Type?>(value: nil)
    init(model: RootModel) {
        self.title.accept(model.title)
        self.targetVC.accept(model.targetVC)
    }
}


RootTableViewCell

主要是cell内部子控件的布局,以及绑定数据到UI

func bind(to viewModel: RootCellViewModel) {
    if let _label = textLabel {
        viewModel.title.bind(to: _label.rx.text).disposed(by: disposeBag)
    }
}


RootViewModel

Input.refresh:接收刷新时机的事件

Output.items:用于TableView绑定内容


class RootViewModel {
    struct Input {
        let refresh: Observable<Void>
    }
    struct Output {
        let items: BehaviorRelay<[RootCellViewModel]>
    }
    func transform(input: Input) -> Output {
        let dataSource = BehaviorRelay<[RootCellViewModel]>(value: [])
        input.refresh.map {[weak self] (_) -> [RootCellViewModel] in
            return self?.dataSource ?? []
        }.bind(to: dataSource).disposed(by: disposeBag)
        return Output(items: dataSource)
    }
    private var dataSource: [RootCellViewModel] {
        get {
             return [...]
        }
    }
}


RootViewController

绑定ViewModel数据,以及监听事件并做出响应

private func bindToViewModel() {
    let output = viewModel.transform(input: RootViewModel.Input(refresh: Observable.just(())))
    //设置cell的数据源
    output.items.asDriver().drive(tableView.rx.items(cellIdentifier: cellId, cellType: RootTableViewCell.self)) {row, viewModel, cell in
        cell.bind(to: viewModel)
    }.disposed(by: disposeBag)
    //cell点击事件直接可以拿到模型数据
    tableView.rx.modelSelected(RootCellViewModel.self).subscribe {[weak self] (cellModel) in
        if let targetVC = cellModel.element?.targetVC.value {
            self?.navigationController?.pushViewController(targetVC.init(), animated: true)
        }
    }.disposed(by: disposeBag)
    //cell点击事件拿到indexPath
    tableView.rx.itemSelected.subscribe {[weak tableView] in tableView?.deselectRow(at: $0, animated: true) }.disposed(by: disposeBag)
    //可以利用它来遵守UITableViewDelegate协议,自己实现代理方法
    tableView.rx.setDelegate(self).disposed(by: disposeBag)
}

注意:tableView设置代理不可以再使用tableView.delegate = self,而是使用tableView.rx.setDelegate(self),否则会抛出异常;

收藏划线


相关文章
|
11月前
|
存储 数据安全/隐私保护
RxSwift+MVVM项目实战-登录功能实现
RxSwift+MVVM项目实战-登录功能实现
201 0
|
11月前
|
存储 Swift
RxSwift+MVVM项目实战-多分组UITableView结合RxDataSources的使用
RxSwift+MVVM项目实战-多分组UITableView结合RxDataSources的使用
294 0
|
11月前
RxSwift+MVVM项目实战-多分组UITableView+RxDataSources+MJRefresh的使用
RxSwift+MVVM项目实战-多分组UITableView+RxDataSources+MJRefresh的使用
120 0
|
11月前
|
存储
RxSwift+MVVM项目实战-单分组UITableView添加、删除、移动功能
RxSwift+MVVM项目实战-单分组UITableView添加、删除、移动功能
104 0
|
11月前
|
JSON HandyJSON Swift
RxSwift+MVVM项目实战-多分组TableView+MJRefresh+RxAlamofire+HandyJSON的使用
RxSwift+MVVM项目实战-多分组TableView+MJRefresh+RxAlamofire+HandyJSON的使用
275 0
|
11月前
|
API Swift iOS开发
|
11月前
|
存储 前端开发
RxSwift+MVVM项目实战-MVVM架构介绍以及实战初体验
RxSwift+MVVM项目实战-MVVM架构介绍以及实战初体验
343 0
|
iOS开发 开发者
iOS开发-简述UITableView中cell的重用问题
iOS开发-简述UITableView中cell的重用问题
177 0
|
Perl 测试技术 Android开发
RxSwift、RxBlocking、RxTest初尝试
在Android开发上,RxJava已经是非常重要的组成之一。最近在用Swift开发iOS应用,考虑在架构设计上使用RxSwift。 添加依赖 # Podfile use_frameworks! target 'YOUR_TARGET_NAME' do pod 'RxSwift', '~...
1747 0
|
前端开发
[译] 实用的 MVVM 和 RxSwift
今天我们将使用 RxSwift 实现 MVVM 设计模式。对于那些刚接触 RxSwift 的人,我 在这里 专门做了一个部分来介绍。
1342 0