0

我正在学习冻结的颤振，我正在尝试从 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;
}
4

1 回答 1

3

使用 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.渲染你的 UI。现在，您应该使用该BlocBuilder方法来呈现您的状态。您可以state.maybeMap()像以前尝试过的那样在此处使用。例如：

BlocBuilder<DisplayNoteCubit, DisplayNoteState>(
  builder: (context, state) {
     return state.maybeMap(
       getData: (getDataState) { ... },
       orElse: () { ... },
     );
  },
),
于 2021-10-03T20:05:53.653 回答