模态底部 Sheet 和 Bloc

Question

当我运行代码类似于以下代码时出现以下错误：使用不包含 Bloc 的上下文调用 BlocProvider.of()。

复制

BlocProvider(
          create: (context) => getIt<TheBloc>()
          child: BlocBuilder<TheBloc, TheState>(
          build: (context, state) =>
          MaterialButton(
            onPressed: () => _showModal(context),
            child: const Text('SHOW BLOC MODAL'),
),

...

void _showModal(BuildContext context) {
  showModalBottomSheet<void>(
    context: context,
    builder: (_) {
          return MaterialButton(
               onPressed() {
                       context.bloc<TheBloc>().add(
                         TheEvent.someEvent(),
                       );
               }
              child: Text('Press button to add event to bloc')
          );
    },
  );
}

Answer 1

您需要用 BlocProvider.value 包装 showModalBottomSheet 的构建器，如下所示：由于上下文是新的。

return BlocProvider.value(
     value: BlocProvider.of<TheBloc>(context),
     child: MaterialButton( ...
     ...

Answer 2

实际上，如果您仅在底部 sheet 而不需要此 bloc，则更好和更清晰的解决方案是为底部 sheet 内容创建 StatefullWidget，在 [=] 中的此小部件内创建 Bloc 11=] 在 build() 方法中使用 bloc，在 dispose() 方法中使用资源。

  showModalBottomSheet<void>(
    context: context,
    builder: (_) {
          return MyBottomSheet(); // your stateful widget
        );
    },
  );

像上面那样使用 bloc 保证你的 bloc 状态在每次 showModalBottomSheet 调用时都是相同的

注意。如果你需要保留 bloc 的状态，你可以尝试使用 AutomaticKeepAliveClientMixin（未测试）

模态底部 Sheet 和 Bloc

Modal Bottom Sheet and Bloc

flutter

bloc

flutter-bloc