如何在特定场景下使用 Flutter BLoC 模式？答案

【问题标题】：How to use Flutter BLoC pattern on specific scenarios?如何在特定场景下使用 Flutter BLoC 模式？
【发布时间】：2021-05-28 11:13:29
【问题描述】：

最近开始学习 Flutter 及其 BLoC partten，BLoC 库中有很多类，如Bloc、PublishSubject、StreamController、BehaviorSubject 等。

我的问题是，我可以在哪些场景下使用这些类？例如，我可以从bloc 继承或不继承，但为什么呢？我对此感到困惑，这些类的使用场景是什么？

【问题讨论】：

标签： flutter bloc flutter-bloc rxdart

【解决方案1】：

如您所见，在您的应用中实现 Bloc 的方法不止一种。您上面提到的类实际上来自不同的包：PublishSubject 和 BehaviorSubject 来自 rxdart 包，而 StreamController 在 Flutter SDK 包中 dart:async

但是，您不需要使用全部甚至其中任何一个来在您的 Flutter 应用程序中实现 Bloc。我将在不使用任何包的情况下通过实现 Bloc 来做一个示例：

1.以普通方式实施 Bloc：
您可以使用 Flutter SDK 中的内容实现 Bloc，而无需使用其他包。通常你创建一个块类将你的逻辑与 UI 分开。该类可能如下所示：

import 'dart:async';

// This is the class that handle all the logic such as receiving data from API, process those data, etc (I'll call it a data processing unit)
class YourBloc {
  
  // Create a stream to send processed data to the UI
  final StreamController _someController = StreamController();

  Stream get someStream => _someController.stream;

  // Get the data from API, then send the data to stream here. Usually an async function
  void loadData() async {
    final data = await doYourApiCall(); // Get data from API
    var processedData = processYourData(data);
    _someController.add(processedData);
  }

  dispose() {
    _someController.close();
  }
}

同时在 UI 中，您启动 loadData() 并使用 StreamBuilder 收听响应数据：

class _SomeScreenState extends State<SomeScreen> {
  // Initiate your bloc
  final YourBloc _bloc = YourBloc();

  // Make the loadData() call
  @override
  void initState() {
    _bloc.loadData();
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return StreamBuilder( // Listen to the datastream with StreamBuilder
      stream: _bloc.someStream,
      builder: (context, snapshot) {
        if (!snapshot.hasData)
          return Center(child: CircularProgressIndicator());
        return ListView.builder(
          itemCount: snapshot.data.length,
          itemBuilder: (context, index) => _buildYourItem(index),
        );
      },
    );
  }
}

2。那么这些包是干什么用的您可以使用一些包来实现 Bloc，例如 flutter_bloc 或 rxdart。 flutter_bloc 提供了一种使用 Bloc/Event/State 概念一致地构建 bloc 的方法，rx_dart 提供了许多工具，因此您可以根据自己的需要操纵 Stream。你可能会看到有人提到provider，它的主要目的是向下传递一个对象，并在你的应用程序中创建一个数据流。

每一个都已经相当成熟并被许多程序员实现了。我建议您仅在您以普通方式实现 Bloc 之后再查看每个文档的文档，这样您就可以真正了解他们在幕后所做的事情。

【讨论】：

感谢您的帮助！