在此测试小部件上方找不到正确的提供程序

Question

======== 手势捕获的异常 ======================================= ========================= 处理手势时引发以下 ProviderNotFoundException：错误：在此测试小部件上方找不到正确的提供程序

发生这种情况是因为您使用的BuildContext不包括您选择的提供者。 有几种常见的场景：

• 您在main.dart中添加了一个新提供程序并执行了热重载。 要修复，请执行热重启。

• 您尝试读取的提供程序位于不同的路径中。

  提供者是“范围的”。 因此，如果您在路由中插入提供程序，那么其他路由将无法访问该提供程序。

• 您使用的BuildContext是您尝试读取的提供程序的祖先。

  确保 Test 在您的 MultiProvider/Provider 下。 这通常发生在您创建提供程序并尝试立即读取它时。

  例如，而不是：

   Widget build(BuildContext context) { return Provider<Example>( create: (_) => Example(), // Will throw a ProviderNotFoundError, because `context` is associated // to the widget that is the parent of `Provider<Example>` child: Text(context.watch<Example>()), ), }

  考虑像这样使用builder ：

   Widget build(BuildContext context) { return Provider<Example>( create: (_) => Example(), // we use `builder` to obtain a new `BuildContext` that has access to the provider builder: (context) { // No longer throws return Text(context.watch<Example>()), } ), }

如果这些解决方案都不起作用，请考虑在 StackOverflow 上寻求帮助： https ://stackoverflow.com/questions/tagged/flutter

我正在构建一个小部件“测试”以通过用户名搜索用户。 这是使用 Bloc 进行测试的小部件。

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

  @override
  Widget build(BuildContext context) {
    return BlocProvider(
      create: (_) => DonorsCubit(),
      child: BlocListener<DonorsCubit, DonorsState>(
        listener: (context, state) {
          print(state);
        },
        child: Scaffold(
          appBar: AppBar(),
          body: IconButton(
            onPressed: () {
              context.read<DonorsCubit>().searchDonors(searchKey: "masum");
            },
            icon: BlocBuilder<DonorsCubit, DonorsState>(
              builder: (context, state) {
                if (state is DonorsInitialState) return const Icon(Icons.add);
                if (state is DonorsLoadedState) return const Icon(Icons.done);
                if (state is DonorsLoadingState) return const Icon(Icons.circle);
                return const SizedBox();
              },
            ),
          ),
        ),
      ),
    );
  }
}

我用这个肘来管理国家。

class DonorsCubit extends Cubit<DonorsState> {
  List<MyUser> users = <MyUser>[];
  final FirebaseDBRepo _firebaseDBRepo = FirebaseDBRepo();
  late StreamSubscription _streamSubscription;

  DonorsCubit() : super(DonorsInitialState()) {
    _streamSubscription =
        _firebaseDBRepo.usersStream().listen((List<MyUser> users) {
      this.users = users;
    });
  }

  void searchDonors({required String? searchKey}) {
    emit(DonorsLoadingState());
    List<MyUser> searchedUser = <MyUser>[];
    searchedUser.clear();
    if (searchKey == null) {
      emit(DonorsLoadedState(users: users));
    } else {
      for (MyUser user in users) {
        if (user.username!.toLowerCase().contains(searchKey.toLowerCase())) {
          searchedUser.add(user);
        }
      }
      emit(DonorsLoadedState(users: searchedUser));
    }
  }

  @override
  Future<void> close() {
    _streamSubscription.cancel();
    return super.close();
  }
}



abstract class DonorsState extends Equatable {
  const DonorsState();
}

class DonorsLoadingState extends DonorsState {
  @override
  List<Object> get props => [];
}

class DonorsInitialState extends DonorsState {
  @override
  List<Object> get props => [];
}

class DonorsLoadedState extends DonorsState {
  final List<MyUser> users;

  const DonorsLoadedState({required this.users});

  @override
  List<Object?> get props => [users];
}

Answer 1

您遇到的问题与提供程序包的工作方式有关。 为了访问肘，您应该在上面的小部件树中提供它。 现在，您在相同的上下文中提供并聆听肘位。 有几种方法可以处理它。

1. 使用Builder小部件。

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

  @override
  Widget build(BuildContext context) {
    return BlocProvider(
      create: (_) => DonorsCubit(),
      child: Builder(
        builder: (context) => BlocListener<DonorsCubit, DonorsState>(
          listener: (context, state) {
            print(state);
          },
          child: Scaffold(
            appBar: AppBar(),
            body: IconButton(
              onPressed: () {
                context.read<DonorsCubit>().searchDonors(searchKey: "masum");
              },
              icon: BlocBuilder<DonorsCubit, DonorsState>(
                builder: (context, state) {
                  if (state is DonorsInitialState) return const Icon(Icons.add);
                  if (state is DonorsLoadedState) return const Icon(Icons.done);
                  if (state is DonorsLoadingState)
                    return const Icon(Icons.circle);
                  return const SizedBox();
                },
              ),
            ),
          ),
        ),
      ),
    );
  }
}

2. 将您的小部件分成两部分，并在父小部件中提供您的肘部：

class TestWrapper extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return BlocProvider(
      create: (_) => DonorsCubit(),
      child: const Test(),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    return BlocListener<DonorsCubit, DonorsState>(
      listener: (context, state) {
        print(state);
      },
      child: Scaffold(
        appBar: AppBar(),
        body: IconButton(
          onPressed: () {
            context.read<DonorsCubit>().searchDonors(searchKey: "masum");
          },
          icon: BlocBuilder<DonorsCubit, DonorsState>(
            builder: (context, state) {
              if (state is DonorsInitialState) return const Icon(Icons.add);
              if (state is DonorsLoadedState) return const Icon(Icons.done);
              if (state is DonorsLoadingState) return const Icon(Icons.circle);
              return const SizedBox();
            },
          ),
        ),
      ),
    );
  }
}

我是选项 2 的粉丝，因为更清楚的是您正在拆分代码并在不同的上下文中工作。

奖金

您可以使用BlocConsumer小部件，而不是单独使用BlocListener和BlocBuilder ：

class TestWrapper extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return BlocProvider(
      create: (_) => DonorsCubit(),
      child: const Test(),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: IconButton(
        onPressed: () {
          context.read<DonorsCubit>().searchDonors(searchKey: "masum");
        },
        icon: BlocConsumer<DonorsCubit, DonorsState>(
          listener: (context, state) {
            print(state);
          },
          builder: (context, state) {
            if (state is DonorsInitialState) return const Icon(Icons.add);
            if (state is DonorsLoadedState) return const Icon(Icons.done);
            if (state is DonorsLoadingState) return const Icon(Icons.circle);
            return const SizedBox();
          },
        ),
      ),
    );
  }
}

Answer 2

我有同样的问题，我使用MultiProvider列出我的提供者，如下所示：

@override
Widget build(BuildContext context) {
  return MultiProvider(
    providers: [
      ChangeNotifierProvider(create: (_) => Example()),
    ],
    child: MaterialApp(
      title: 'Example',
      debugShowCheckedModeBanner: false,
      theme: ThemeData.dark().copyWith(
        textTheme: GoogleFonts.poppinsTextTheme(Theme.of(context).textTheme)
      ),
      // here I set my first screen...
      home: HomePage(),
    ),
  );
}