Flutter 调用 context.read 时 BloC 找不到正确的提供者

Question

我是Flutter和BloC的新手，所以我想创建一个项目来提高我对它们的了解。

在下方您可以看到 dart 个文件。

bnb_cubit.dart

class AppBottomNavigationBarCubit extends Cubit<AppBottomNavigationBarState> {
  AppBottomNavigationBarCubit()
      : super(AppBottomNavigationBarState(selectedIndex: 0));

  void change(int index) =>
      emit(AppBottomNavigationBarState(selectedIndex: index));
}

bnb_state.dart

class AppBottomNavigationBarState {
  int selectedIndex;
  AppBottomNavigationBarState({required this.selectedIndex});
}

bnb.dart

class AppBottomNavigationBar extends StatelessWidget {
  AppBottomNavigationBar({super.key});

  final List<Widget> screens = [HomeScreen(), SearchScreen(), LibraryScreen()];

  @override
  Widget build(BuildContext context) {
    return BlocBuilder<AppBottomNavigationBarCubit,
        AppBottomNavigationBarState>(
      builder: (context, state) {
        return Scaffold(
          bottomNavigationBar: BottomNavigationBar(
            items: const [
              BottomNavigationBarItem(
                icon: Icon(Icons.home_filled),
                label: "Home",
              ),
              BottomNavigationBarItem(
                icon: Icon(Icons.search),
                label: "Home",
              ),
              BottomNavigationBarItem(
                icon: Icon(Icons.library_books),
                label: "Home",
              ),
            ],
            onTap: (value) {
              context.read<AppBottomNavigationBarCubit>().change(value);
            },
            currentIndex:
                context.read<AppBottomNavigationBarState>().selectedIndex,
          ),
          body: screens[state.selectedIndex],
        );
      },
    );
  }
}

主要.dart

Future<void> main() async {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return BlocProvider<AppBottomNavigationBarCubit>(
      create: (context) => AppBottomNavigationBarCubit(),
      child: MaterialApp(
        title: 'Flutter Demo',
        theme: ThemeData(
          primarySwatch: Colors.blue,
        ),
        home: AppBottomNavigationBar(),
      ),
    );
  }
}

在bnb.dart文件中，如果我使用

context.read<AppBottomNavigationBarState>().selectedIndex

要更改BottomNavigationBar的currentIndex字段，应用程序会抛出：

The following ProviderNotFoundException was thrown building
BlocBuilder<AppBottomNavigationBarCubit,
AppBottomNavigationBarState>

但是，如果我将该行更改为

state.selectedIndex

它工作正常，我想知道为什么会这样。

我的第二个问题是，您会使用BloC来创建BottomNavigationBar吗？

提前致谢！

Answer 1

您需要阅读AppBottomNavigationBarCubit以获取当前的 state。

所以它会是

currentIndex:
        context.read<AppBottomNavigationBarCubit>().state.selectedIndex,

Answer 2

您应该使用Cubit访问它

context.read<AppBottomNavigationBarCubit>().state.selectedIndex

不是State

context.read<AppBottomNavigationBarState>()

由于您只提供AppBottomNavigationBarCubit而不是AppBottomNavigationBarState ：

return BlocProvider<AppBottomNavigationBarCubit>()

您遇到错误couldn't find correct provider