Home > Enterprise >  How to make two different cubits and states in bloc consumer?
How to make two different cubits and states in bloc consumer?

Time:12-07

I have two cubits and states => DeviceBloc, DeviceScreen and StatisticsCubit, StatisticsState.

And I want to use all of them in one page(bloc consumer). How can I do this?

This is my code, I want to add StatisticsCubit, StatisticsState inside BlocCinsumer

return BlocConsumer<DeviceScreenBloc, DeviceScreenState>(listener: (context, state) async {}

CodePudding user response:

You could wrap a BlocConsumer in another BlocConsumer like so:

    BlocConsumer<DeviceScreenBloc, DeviceScreenState>(
      listener: (context, deviceScreenState) {},
      builder: (context, deviceScreenState) {
        return BlocConsumer<StatisticsCubit, StatisticsState>(
          listener: (context, statisticsState) {},
          builder: (context, statisticsState) {
            ...
          },
        );
      },
    );

CodePudding user response:

Just nest the bloc builder method and create the proper implementations.

class HomeScreen extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
      return Scaffold(
         appBar: _buildAppbar(context),
         body: BlocConsumer<TasksCubit, TasksStates>(
            listener: (context, state) {},
            builder: (context, state) {
               return BlocConsumer<TasksOperationsCubit, TasksOperationsStates>(
                 listener: (operationsContext, operationsState) {
                   if (operationsState is InsertIntoDatabaseSuccessState ||
              operationsState is DeleteTaskItemSuccessState ||
              operationsState is UpdateTaskItemSuccessState) {
            TasksCubit.get(context).getAllTasks();
          }
        },
        builder: (operationsContext, operationsState) {
            return _buildTasks(state.tasks);
        },
      );
    },
  ),
);

}

  • Related