将 Cubit 用于 Flutter 表单

Question

我正在尝试使用 Cubit 状态管理表单（验证和提交）。有什么我可以效仿的例子吗？

我已经尝试实现它并且它有效，但每次出现错误时，它都会再次向我显示带有空字段的表单，因为小部件是用初始数据重新绘制的。我该如何解决？

这是我在表格上的 Cubit 消费者代码：

BlocConsumer<LoginCubit, LoginState> buildLoginCard(BuildContext context) {
  return BlocConsumer<LoginCubit, LoginState>(
    listener: (context, state) {
      if (state is LoginError) {
        Scaffold.of(context).showSnackBar(
          SnackBar(
            content: Text(state.message),
            backgroundColor: Colors.red,
          ),
        );
      } else if (state is LoginSuccess) {
        BlocProvider.of<AuthCubit>(context).autoLogin();
      }
    },
    builder: (context, state) {
      if (state is LoginInProgress) {
        return LoadingWidget();
      } else {
        return LoginCardWidget();
      }
    },
  );
}

Answer 1

您可以尝试在 listener

之后将此添加到您的 BlocConsumer

buildWhen: (previous, current) {
    if (current is LoginError)
      return false;
    else
      return true;
  },

在这种情况下，如果状态是错误的，它将不会重新构建小部件，并且字段将拥有自己的值而不会被更改

将 Cubit 用于 Flutter 表单

Use Cubit for Flutter form

flutter

flutter-bloc