使用 Bloc 添加到列表（flutter）

Question

我刚刚开始学习如何在 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 []});
}

这是 ui：（要添加和删除的提升按钮）

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());
                        })
                  ],
                ),

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

Answer 1

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

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

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

使用 Bloc 添加到列表（flutter）

Adding to list with Bloc (flutter)

state-management

dart

flutter

bloc