BlocProvider Error: Could not find the correct Provider<CounterBloc>

BlocProvider Error: Could not find the correct Provider<CounterBloc>

我在没有导航的地方写了基本 BlocProvider,但我仍然遇到以下错误

Error: Could not find the correct Provider above this CounterPage Widget

这是 GitHub 上可复制项目的 link。

简而言之,您可以按如下方式将 child 包装在 Builder 中,或者为 child 创建一个新的 StatelessWidgetStatefulWidget

Providers 将 objects 注入 child 元素。原来 build() 中的 BuildContext object 是在 CounterBloc 被注入之前。

import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:japa_counter/counter_widget/counter_widget.dart';
import 'counter_widget/model/counter_model.dart';
import 'counter_widget/bloc/counter_bloc.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Japa Counter',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const CounterPage(),
    );
  }
}

class CounterPage extends StatelessWidget {
  const CounterPage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return  BlocProvider<CounterBloc>(
      create: (_) => CounterBloc(),
      // -------------------- Wrapped in Builder ----------------------
      child: Builder(
        builder: (context) => Scaffold(
            appBar: AppBar(
              title: const Text("Japa Counter"),
            ),
            body: Center(
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  FloatingActionButton(
                    onPressed: () =>
                        context.read<CounterBloc>().add(IncrementCounter()),
                    tooltip: 'Increment',
                    child: const Icon(Icons.add),
                  ),
                  const SizedBox(width: 60.0, child: Divider()),
                  FloatingActionButton(
                    onPressed: () =>
                        context.read<CounterBloc>().add(DecrementCounter()),
                    tooltip: 'Decrement',
                    child: const Icon(Icons.remove),
                  ),
                  const CounterWidget(),
                ],
              ),
            ),
          )
      ),
// This trailing comma makes auto-formatting nicer for build methods.
    );
  }
}