如何在颤动块模式中在一肘中添加多个状态？答案

【问题标题】：How to add multiple state in one cubit in flutter bloc pattern?如何在颤动块模式中在一肘中添加多个状态？
【发布时间】：2021-08-13 10:33:29
【问题描述】：

我在 Flutter 中开发了一个应用程序，它执行基于 OTP 的身份验证来登录。之前我在类本身中管理状态，以便我可以使用 setState 方法相应地呈现 UI。然后我改成flutter_bloc cubit模式来管理状态。但我不明白如何在一肘内跟踪多个状态。

考虑以下状态和肘的代码，


**State**.

@immutable
abstract class LoginState {}

class LoginInitial extends LoginState {
  final Map loginState;
  LoginInitial({this.loginState});
}

**Cubit**
class LoginCubit extends Cubit<LoginState> {
  Map loginState = {
    "isPhoneSubmitted": false,
    "isOtpArrived": false,
  };
  LoginCubit()
      : super(
          LoginInitial(
            loginState: {
              "isPhoneSubmitted": false,
              "isOtpArrived": false,
            },
          ),
        );

  void sendOtp() {
    emit(
      LoginInitial(
        loginState: {
          "isPhoneSubmitted": true,
          "isOtpArrived": false,
        },
      ),
    );
    Future.delayed(Duration(seconds: 4), () {
      emit(
        LoginInitial(
          loginState: {
            "isPhoneSubmitted": true,
            "isOtpArrived": true,
          },
        ),
      );
    });
  }
}

在这里，最初，我将地图内的两个值都设置为 false。当用户单击将isPhoneSubmitted 设置为true 的按钮时。几秒钟后isOtpArrived 变为真（在获得 OTP 后的未来）。但是，我认为这不是实现该模式的正确方法。考虑一下，如果我在一个类中有 10 个属性，并且每次调用 emit 方法时都会发送一个包含 10 个属性的映射。

有人可以帮助我理解或实施最佳实践，以保持/更新 Cubit 正在侦听的小部件的多个状态吗？

另外，在小部件中，这就是我收听变化的方式，

 BlocBuilder<LoginCubit, LoginState>(builder: (context, state) {
                final data = (state as LoginInitial).loginState;
                if (!data["isPhoneSubmitted"]) {
                  return phoneNumberSubmitWidget();
                } else {
                  return codeVerificationWidget();
                }
              }),

【问题讨论】：

正如你所说，这不是一个正确的方法。深入了解bloclibrary.dev/#/gettingstarted 和教程，以更好地理解集团状态管理
可以在builder函数中监听状态。将您的 if 语句更改为 (state is MyState) 之后，构建器应在状态更改时得到更新。如果这回答了你的问题？
感谢您的评论@SilkeNL。如果我使用 state is MyState 方法，它实际上可以在不同的状态类中操纵一个状态。即便如此，我如何才能跟踪多个状态值。如果我下次操作一个属性，它会更改为另一个。
正如@nvoigt 的回答所说，使用 Bloc 而不是 Cubit 可能会更好。然后你可以yield不同的状态。在加载和加载状态之间来回切换。然后您的小部件将在每次状态更改时更新。
是的，@SilkeNL。我已经完成并准备实施集团本身。实际上，我正在使用 flutter_bloc 库。在他们的文档中，只有一个肘的例子。我遵循了很多指南并且非常困惑。即使是 bloc，也有很多人在使用 flutter_bloc，而且很多人直接从头开始编写。这实际上非常令人困惑，以至于我的应用程序将来会变得非常复杂。

标签： flutter dart flutter-bloc cubit

【解决方案1】：

但是，我认为这不是实现该模式的正确方法。

你是对的。复杂状态切换的第一步是不要使用Cubit，而是使用实际的Bloc。 Cubits 用于非常简单的数据，基本上没有状态流逻辑。像一个int。或者也许是 DarkTheme/LightTheme 开关。或者可能是一种语言，它只能是一种，而且只能是一种。

但是你有一个复杂的流程。具有“中间”状态。所以请使用Bloc 并阅读有关此的教程，在这种情况下可能是login tutorial。

【讨论】：

感谢@nvoigt 的建议。我正在尝试实现集团本身而不是使用肘。但是，上面的例子非常复杂，会导致我有很多样板代码。如果可能的话，你能给我一个简单的使用flutter_bloc库的例子吗？