Flutter，BLoC 是否需要 rx dart？

Question

在我看到的 bloclibrary 官方網站文檔中，我從未見過他們使用 rx dart。

但是，有時在社區中，他們說將 rx dart 一起使用要好得多。 但我不明白。 我使用 firestore 作為后端，我只是覺得我根本不需要 rxdart。 即使我努力搜索，我也無法看到使用 rx dart + BLoC 的好的示例項目。

如果您將 rx dart 與 BLoC 一起使用，有什么好處？ 我可以看一個例子嗎？

Answer 1

您正在將 BLoC 模式與 Bloc 庫混合在一起。

BLoC 模式是由 Google 創建的反應式 state 管理解決方案。 它的目標是充當應用程序中數據之間的中間人，例如，處理 state 和 API 和 UI 之間的業務邏輯。

它意味着獨立於平台，這意味着 Bloc 中的相同 dart 代碼將在 Flutter 和 Angular 等框架中工作。

通常，使用 RxDart，您可以像這樣創建一個 BLoC：

class AppDataBloc {
  // The publish subject is responsible for get/add data and 
  // pass it to the UI as a stream.
  final _appDataSubject = PublishSubject<AppData>();

  // This is the stream the UI will use.
  Observable<AppData> get appData => _appDataSubject.stream;

}

另一方面，Bloc 庫是 BLoC 模式的實現。

它不僅提供了一種簡單、統一和直觀的方式來實現 BLoC 模式，而且還使您的應用程序非常易於測試和維護。

所以要回答你的問題，你不需要 RxDart，除非你想自己實現 BLoC 模式。 如果您使用 Bloc 庫，那么您已經在使用 BloC 模式的免費 RxDart 實現。

Answer 2

如果您參考 Felix Angelov 創建的bloc package ，您不一定需要使用rx_dart ，但您可以。

例如，您可以在transformEvents和/或transformTransitions上應用一些 rx_dart 運算符，例如 switchMap、where、debounce、throttle 等。 通過這種方式，您可以操縱即將到來的事件（例如應用背壓，這將避免服務器因過多的請求而過載）

集團生命周期

如果您想充分利用反應式流，您可以探索rx_bloc生態系統，它是包含rx_dart的業務邏輯組件模式的實現。

基本上，您需要聲明特定功能的合同，然后以反應方式實現符合它的 bloc。 例如，如果您需要從 API 獲取一些新聞，您需要以這種方式聲明合約：

/// A contract, containing all News BloC incoming events
abstract class NewsBlocEvents {
  /// Send a search event to the bloc with some payload
  void search({required String query});
}

/// A contract, containing all News BloC states
abstract class NewsBlocStates {
  /// The news found by the search query
  ///
  /// It can be controlled by executing [NewsBlocStates.search]
  ///
  Stream<Result<List<News>>> get news;
}

現在當所有合約都定義好后，你需要實現 Reactive BloC

/// A BloC responsible for the news
@RxBloc()
class NewsBloc extends $NewsBloc {
  /// The default constructor injecting a repository through DI
  NewsBloc(this._repository);
  
  /// The repository used for data source communication
  final NewsRepository _repository;

  /// Your events-to-sate business logic
  @override
  Stream<Result<List<News>>> _mapToNewsState() =>                 
      _$searchEvent
          /// Here you can apply any of the rx_dart operators
          /// for instance, you can apply back pressure
          .debounceTime(Duration(seconds: 1))
          /// Then you get the data from the repository
          .switchMap((_) => 
              _repository.decrement().asResultStream(),
          );
}

實現業務邏輯后，您可以使用flutter_rx_bloc訪問小部件樹中的塊。 有很多文章和示例，您可以在其中學習如何使用這個生態系統。