Provider not found Flutter

Viewed 288

I want to share some data across different widgets so I decided to use a ChangeNotifierProvider<Example> with its relative Consumer<Example>. I have already used Providers before but never in this way (in fact I got some errors).

ChangeNotifierProvider<Example> has been defined in menu page while Consumer<Example> in an other widget defined in menu too.

Menu page :

class Menu extends StatefulWidget {
//...SOme code
ChangeNotifierProvider<Example>(
              create: (context) => Example(),
              child: ShowMultipleAnswers()
//...some code

And now I would like to use Consumer<Example> inside ShowMultipleAnswers() widget consuming data created in menu like :

class ShowMultipleAnswers extends StatefulWidget {
//...some code
Widget build(BuildContext context) {
    return Consumer<Example>(builder: (context, handler, child) {
//some code

But I got these errors :

Error: Could not find the correct Provider<Example> above this Consumer<Example> Widget

This happens because you used a `BuildContext` that does not include the provider
of your choice. There are a few common scenarios:

- You added a new provider in your `main.dart` and performed a hot-reload.
  To fix, perform a hot-restart.

- The provider you are trying to read is in a different route.

  Providers are "scoped". So if you insert of provider inside a route, then
  other routes will not be able to access that provider.

- You used a `BuildContext` that is an ancestor of the provider you are trying to read.

consider using `builder` like so:
Make sure that Consumer<Example> is under your MultiProvider/Provider<Example>.
  This usually happens when you are creating a provider and trying to read it immediately.

  For example, instead of:

  ```
  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>()),
    ),
  }
  ```


  ```
  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>()),
      }
    ),
  }
  ```

I think the most valid options are 2 :

- The provider you are trying to read is in a different route.

But I don't know because they should be in the same, I mean ShowMultipleAnswers() is the Provider child. Or the second

- You used a `BuildContext` that is an ancestor of the provider you are trying to read.

In this case, following suggestions above, I should use a builder:(context){} instead of directly calling child : .. but I read that after provider 5 builder has been substituted by create so I'm confused.

If I'm using wrong widgets tell me please!

2 Answers

The error message exactly specifies and describe your error

ShowMultipleAnswers got built using Menu context which doesn't have the Example provider, thus it throws this error.

you can either use builder attribute instead of child or wrap your MaterialApp with the provider

your code should be something like this:

class Menu extends StatefulWidget {
//...SOme code
ChangeNotifierProvider<Example>(
              create: (context) => Example(),
              builder: (context) {
                 return ShowMultipleAnswers();
              } 
//...some code

I forgot to say that there was an other page between Menu and ShowMultipleAnswers, like a bridge between them so the real flow was :

Menu Page -> Bridge Page -> ShowMultipleAnswers Page.

I removed this Bridge Page and it worked! But I still don't understand why it didn't work, maybe because Bridge Page didn't have any references of its Provider?

Related