cubit 状态总是返回一个空值

Question

我正在学习冻结的颤振，我正在尝试从 sqflite 检索数据。我有一个没有集团模式的成就，它工作得很好。但是当我使用 bloc 这样做时，返回值始终为 null！。

这个按钮在被点击时应该会获取数据：

  BlocBuilder<DisplayNoteCubit, DisplayNoteState>(
                      builder: (context, state) {
                        return MaterialButton(
                          onPressed: () async {
                            print( '\n print all Data \n ${state.maybeMap(orElse: () {}, getData: (g) => g.notes)}');
                          },
                          child: const Text("Click Me"),
                        );
                      },
                    ),

区号为：

final DBHelper _db=DBHelper.instance;

class DisplayNoteCubit extends Cubit<DisplayNoteState> {
  DisplayNoteCubit() : super(const DisplayNoteState.initial());
  void  getData() {
    state.maybeMap(
        orElse: () {},
        getData: (getData) async{
          emit(getData.copyWith(notes:await  _db.getAllNotesFormDB()));
        });
  }
}

状态码是：

@freezed
abstract class DisplayNoteState with _$DisplayNoteState {
  const factory DisplayNoteState.initial() = Initial;
  const factory DisplayNoteState.getData({required List<Map<String, dynamic>> notes}) = GetData;
}

Answer 1

使用 Cubit 时，您的状态生命周期如下所示：

1. 你在 Cubit 上调用了一个方法；
2. Cubit 处理该方法并发出一个新状态；
3. 您的 UI 订阅状态​​并相应地重新呈现。

现在，您需要修复代码中的几个方面：

第 1 步。 BlocBuilder 仅在您需要订阅状态更改并根据当前状态呈现 UI 时使用。在您的情况下，您只想使用按钮执行该方法，因此在这种情况下不需要BlocBuilder。

改变这个：

BlocBuilder<DisplayNoteCubit, DisplayNoteState>(
  builder: (context, state) {
    return MaterialButton(
      onPressed: () async {
        print( '\n print all Data \n ${state.maybeMap(orElse: () {}, getData: (g) => g.notes)}');
      },
      child: const Text("Click Me"),
    );
  },
),

到这里：

return MaterialButton(
  onPressed: () async {
    context.read<DisplayNoteCubit>().getData(); // Triggers getData() method on Cubit
  },
  child: const Text("Click Me"),
);

第 2 步。 检索数据并发出状态更改。

改变这个：

final DBHelper _db=DBHelper.instance;

class DisplayNoteCubit extends Cubit<DisplayNoteState> {
  DisplayNoteCubit() : super(const DisplayNoteState.initial());
  void  getData() {
    state.maybeMap(
        orElse: () {},
        getData: (getData) async{
          emit(getData.copyWith(notes:await  _db.getAllNotesFormDB()));
        });
  }
}

到这里：

final DBHelper _db=DBHelper.instance;

class DisplayNoteCubit extends Cubit<DisplayNoteState> {
  DisplayNoteCubit() : super(const DisplayNoteState.initial());

  Future<void> getData() async {
    final notes = await _db.getAllNotesFormDB();

    emit(DisplayNoteState.getData(notes: notes)); // Emits state with retrieved notes
  }
}

第 3 步。 呈现您的用户界面。现在，您应该使用BlocBuilder 方法来呈现您的状态。您可以像之前尝试的那样在此处使用state.maybeMap()。例如：

BlocBuilder<DisplayNoteCubit, DisplayNoteState>(
  builder: (context, state) {
     return state.maybeMap(
       getData: (getDataState) { ... },
       orElse: () { ... },
     );
  },
),