Flutter 在 MultiBlocProvider 中使用 BlocListener 和 BlocBuilder答案

【问题标题】：Flutter use BlocListener and BlocBuilder inside MultiBlocProviderFlutter 在 MultiBlocProvider 中使用 BlocListener 和 BlocBuilder
【发布时间】：2022-01-06 05:41:47
【问题描述】：

在我的程序中，我有两个不同的 Bloc 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 ???
     ),
);

【问题讨论】：

标签： flutter bloc state-management flutter-bloc flutter-state

【解决方案1】：

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

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

【讨论】：

【解决方案2】：

如果您使用构建器小部件包装孩子，则可以使用这些提供程序。但是在读取提供程序时，请确保使用构建器的上下文。


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

【讨论】：

这也是正确的。非常感谢。