flutter - 使用 Bloc 添加到列表( flutter )

标签 flutter dart bloc state-management

我刚刚开始学习如何在 flutter 中使用 BLOC 管理状态。 我编写了这个小而简单的示例(使用 Cubit),该示例应该将名称添加到列表中并从列表中删除。 该列表没有填满,我无法弄清楚问题出在哪里。

我的代码:

class StudentHandlerCubit extends Cubit<StudentHandlerState> {
  ///initial value is set here:
  StudentHandlerCubit() : super(StudentHandlerState(badSts: []));

  addToBadSts(String name) {
    state.badSts.add(name);
    return emit(StudentHandlerState(badSts: state.badSts));
  }

  void removeFromBadSts(String name){
    state.badSts.removeWhere((element) => element==name);
    return emit(StudentHandlerState(badSts: state.badSts));
  }

}
class StudentHandlerState{
  ///Sts = Students
  List<String> badSts = [];
  StudentHandlerState({badSts=const []});
}

这是用户界面:(用于添加和删除的提升按钮)

class CustomElevatedButton extends StatelessWidget {
  final ButtonState buttonState;
  final GlobalKey<FormState> globalKey;
  final TextEditingController controller;

  const CustomElevatedButton({Key? key,
    required this.buttonState,
    required this.globalKey,
    required this.controller})
      : super(key: key);

  @override
  Widget build(BuildContext context) {
    var blocModel = context.read<StudentHandlerCubit>();
    return ElevatedButton(
      style: ElevatedButton.styleFrom(
          primary: buttonState == ButtonState.add ? Colors.green : Colors.red),
      onPressed: () {
        if (globalKey.currentState!.validate()) {
          _onPressed(context, buttonState, controller);
          // Navigator.pop(context);
        }
      },
      child: Text(_setText(buttonState)),
    );
  }

  void _onPressed(BuildContext ctx, ButtonState bs,
      TextEditingController cntr) {
    var blocModel = ctx.read<StudentHandlerCubit>();
    bs == ButtonState.add ?
    blocModel.addToBadSts(cntr.text) :
    blocModel.removeFromBadSts(cntr.text);

  }
  String _setText(ButtonState bs) {
    return bs == ButtonState.add ?
    'add' : 'delete';
  }

}

这是我想显示所有名称的列:

Column(
                  children: [
                    const Text(header1),
                    const Divider(
                      thickness: 2,
                    ),
                    BlocBuilder<StudentHandlerCubit,
                        StudentHandlerState>(
                        builder: (context, handler) {
                          return Column(
                              children: handler.badSts
                                  .map((e) => Text(e))
                                  .toList());
                        })
                  ],
                ),

该代码库不起作用。 感谢您的帮助。

最佳答案

您的 StudentHandlerState 并未将新的项目列表添加到其内部 badSts 变量中,因此当您发出新状态时,不会更新任何内容。请尝试以下操作。

class StudentHandlerState {
  ///Sts = Students
  List<String> badSts;
  StudentHandlerState({required this.badSts});
}

使用 this.badSts 将传入的参数分配给 badSts 变量。

关于flutter - 使用 Bloc 添加到列表( flutter ),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/71975078/

相关文章:

flutter - 在渲染上更新小部件值?

flutter - 错误:类 'QuerySnapshot'没有实例获取方法 'data'

flutter - 在拍打状态下显示警报

flutter - 在 flutter 中重新启动(关闭并再次打开)后对话框状态不会改变

dart - 如何基于Durandal和dart创建项目

flutter - MultiBlocProvider 未实例化所有 block 提供程序 - 如何正确使用 MultiBlocProvider?

dart - 将字符串从 firestore 保存到变量

flutter - 调用 Geocoder.local.findAddressesFromCoordinates 时发生 PlatformException

flutter - 如何在Flutter中实现多个倒计时进度条?

flutter - Flutter 发布版 apk 中字体丢失