Flutter 在 MultiBlocProvider 中使用 BlocListener 和 BlocBuilder

Question

在我的程序中，我有两个不同的 Blocs bloc1 和 bloc2。我使用 MultiBlocProvider 并添加这两个集团。现在我想在 MultiBlocProvider 中同时使用 BlocListener 和 BlocBuilder。对于 bloc1 我想要 BlocBuilderand 对于 bloc2 我想要 BlocListener。我该怎么做？

Scaffold(
      body: MultiBlocProvider(
        providers: [
          BlocProvider<GenerateFieldsBloc>(
            create: (_) => bloc1,
          ),
          BlocProvider<SubmitFieldBloc>(
            create: (_) => bloc2,
          ),
        ],
        child:() //here how can I use both BlocListener and BlocBuilder ???
     ),
);

Answer 1

如果您使用构建器小部件包装子项，则可以使用这些提供程序。但是你一定要在阅读提供者时使用构建器的上下文。


Scaffold(
      body: MultiBlocProvider(
          providers: [
            BlocProvider<GenerateFieldsBloc>(
              create: (_) => bloc1,
            ),
            BlocProvider<SubmitFieldBloc>(
              create: (_) => bloc2,
            ),
          ],
        child: Builder(
          builder: (context) {
            return BlocListener<GenerateFieldsBloc, GenerateFieldsState>(
            listener: (context, state) {
              // TODO: implement listener
            },
            child: BlocBuilder<SubmitFieldBloc, SubmitFieldState>(
              builder: (context, state) {
                return Text('asdasd');
              },
            ),
          );
          }
        ),
      ),
    );

Answer 2

您可以按如下方式嵌套它们：

BlocListener<SubmitFieldBloc, SubmitFieldState>(
  listener: (context, state) {
    // listen to SubmitFieldBloc
  },
  child: BlocBuilder<GenerateFieldsBloc, GenerateFieldsState>(
    builder: (context, state) {
       // build with GenerateFieldsBloc 
    }
  ),
)

Flutter 在 MultiBlocProvider 中使用 BlocListener 和 BlocBuilder

Flutter use BlocListener and BlocBuilder inside MultiBlocProvider

flutter

bloc

state-management

flutter-bloc

flutter-state