使用RxSwift进行Paginated API调用

Question

我正在为iOS应用程序开始我的第一个RxSwift项目并学习反应式编程.

到目前为止,这个想法非常简单,用户搜索与搜索栏文本匹配的电影,这会触发一个请求,用于填充带有结果的UITableView.使用在线发现的教程和示例我已经设法实现这一点而不会有太多麻烦.

当我试图加载通过滚动表格视图底部触发的下一页结果时,棘手的部分就出现了.

这是到目前为止使用的代码:

public final class HomeViewModel: NSObject {

    // MARK: - Properties

    var searchText: Variable<String> = Variable("")
    var loadNextPage: Variable<Void> = Variable()

    lazy var pages: Observable<PaginatedList<Film>> = self.setupPages()

    // MARK: - Reactive Setup

    fileprivate func setupPages() -> Observable<PaginatedList<Film>> {
        return self.searchText
            .asObservable()
            .debounce(0.3, scheduler: MainScheduler.instance)
            .distinctUntilChanged()
            .flatMapLatest { (query) -> Observable<PaginatedList<Film>> in
                return TMDbAPI.Films(withTitle: query, atPage: 0)
            }
            .shareReplay(1)
    }
}

这是我到目前为止:observable pages绑定到我的表视图HomeViewController,其搜索栏文本绑定到searchText.

我正在使用Alamofire在幕后执行API调用,并TMDbAPI.Films(withTitle: query)返回一个Observable的分页列表.

这是我的模型结构 PaginatedList

public struct PaginatedList<T> {

    // MARK: - Properties

    let page: Int
    let totalResults: Int
    let totalPages: Int
    let results: [T]

    // MARK: - Initializer

    init(page: Int, totalResults: Int, totalPages: Int, results: [T]) {
        self.page = page
        self.totalResults = totalResults
        self.totalPages = totalPages
        self.results = results
    }

    // MARK: - Helper functions / properties

    var count: Int { return self.results.count }

    var nextPage: Int? {
        let nextPage = self.page + 1
        guard nextPage < self.totalPages else { return nil }
        return nextPage
    }

    static func Empty() -> PaginatedList { return PaginatedList(page: 0, totalResults: 0, totalPages: 0, results: []) }
}

extension PaginatedList {

    // MARK: - Subscript

    subscript(index: Int) -> T {
        return self.results[index]
    }
}

我现在正在寻找一种反应方式来将我的loadNextPage变量挂钩到分页列表的可观察对象,它会触发对下一页的请求.当搜索栏文本更改时,它会将分页重置为0.

我相信运营商的使用scan并且concat需要,但我仍然不确定如何......

如何实现这一点的任何建议将非常感谢...

Answer 1

这是你如何构建它:

// Some kind of page request result.  Modify it to be what you're using.

struct SomePageResult {
    let content: String
}

// Needs modification to return your actual data

func getPage(query: String, number: UInt) -> SomePageResult {
    return SomePageResult(content: "some content for search (\(query)) on page \(number)")
}

// Actual implementation

let disposeBag = DisposeBag()

var loadNextPage = PublishSubject<Void>()
var searchText = PublishSubject<String>()
let currentPage = searchText
    .distinctUntilChanged()
    .flatMapLatest { searchText in
        return loadNextPage.asObservable()
            .startWith(())
            .scan(0) { (pageNumber, _) -> UInt in
                pageNumber + 1
            }
            .map { pageNumber in
                (searchText, pageNumber)
            }
    }
    .map { (searchText, pageNumber) in
        getPage(searchText, number: pageNumber)
    }

currentPage
    .subscribeNext { print($0) }
    .addDisposableTo(disposeBag)

searchText.onNext("zebra")
searchText.onNext("helicopter")
loadNextPage.onNext()
searchText.onNext("unicorn")
searchText.onNext("unicorn")
searchText.onNext("ant")
loadNextPage.onNext()
loadNextPage.onNext()
loadNextPage.onNext()

输出:

SomePageResult(内容:"第1页上的一些搜索内容(斑马)")
SomePageResult(内容:"第1页上搜索的一些内容(直升机)")
SomePageResult(内容:"第2页搜索的一些内容(直升机)" )
SomePageResult(内容:"第1页上的一些搜索内容(独角兽)")
SomePageResult(内容:"第1页上搜索的一些内容(ant)")
SomePageResult(内容:"第2页的搜索内容(ant) ")
SomePageResult(内容:"第3页上的搜索内容(蚂蚁)")
SomePageResult(内容:"第4页上的搜索内容(蚂蚁)")

Answer 2

根据RxSwift GitHub repo中提供的示例,我设法做到了.

基本上,我正在使用一个返回我的PaginatedList项目流的递归函数,它使用下一页的loadNextPage触发器调用自身.这是我在API管理器中使用的代码:

class func films(withTitle title: String, startingAtPage page: Int = 0, loadNextPageTrigger trigger: Observable<Void> = Observable.empty()) -> Observable<[Film]> {
    let parameters: FilmSearchParameters = FilmSearchParameters(query: title, atPage: page)
    return TMDbAPI.instance.films(fromList: [], with: parameters, loadNextPageTrigger: trigger)
}

fileprivate func films(fromList currentList: [Film], with parameters: FilmSearchParameters, loadNextPageTrigger trigger: Observable<Void>) -> Observable<[Film]> {

    return self.films(with: parameters).flatMap { (paginatedList) -> Observable<[Film]> in
        let newList = currentList + paginatedList.results
        if let _ = paginatedList.nextPage {
            return [
                Observable.just(newList),
                Observable.never().takeUntil(trigger),
                self.films(fromList: newList, with: parameters.nextPage, loadNextPageTrigger: trigger)
            ].concat()
        } else { return Observable.just(newList) }
    }
}

fileprivate func films(with parameters: FilmSearchParameters) -> Observable<PaginatedList<Film>> {
    guard !parameters.query.isEmpty else { return Observable.just(PaginatedList.Empty()) }
    return Observable<PaginatedList<Film>>.create { (observer) -> Disposable in
        let request = Alamofire
            .request(Router.searchFilms(parameters: parameters))
            .validate()
            .responsePaginatedFilms(queue: nil, completionHandler: { (response) in
                switch response.result {
                case .success(let paginatedList):
                    observer.onNext(paginatedList)
                    observer.onCompleted()
                case .failure(let error):
                    observer.onError(error)
                }
            })
        return Disposables.create { request.cancel() }
    }
}

然后在我的视图模型中,这是我必须要做的全部事情:

fileprivate func setupFilms() -> Observable<[Film]> {

    let trigger = self.nextPageTrigger.asObservable().debounce(0.2, scheduler: MainScheduler.instance)

    return self.textSearchTrigger
        .asObservable()
        .debounce(0.3, scheduler: MainScheduler.instance)
        .distinctUntilChanged()
        .flatMapLatest { (query) -> Observable<[Film]> in
            return TMDbAPI.films(withTitle: query, loadNextPageTrigger: trigger)
        }
        .shareReplay(1)
}