Provider not accesable when Navigate to new screen

Question

have a problem that I'm sitting on couple of days now. have an app where:

• depending of AUTH state, 'LoginScreen' or 'MainScreen' is Shown.

• in MainScreen I setUp bottomNavigation with screens (HomeScreen, ShoppingScreen,MyFavorites)

• I set up there as well my StreamProviders(those depend on Auth) by using MultiProvider
• on HomeScreen when I User Provider.of(context) it works like it should

• but when I use :

  `Navigator.push(
    context,
    MaterialPageRoute(
      builder: (_) => ProfileScreen(),
    ),
  );
  

` and use Provider.of(context) there I get "Could not find correct Provider....above this...widget"

I read some issues on that and solution there was to decler providers above MaterailApp which in my case I can not do because I can set up thoese only after Auth is successfull.

Tryed passing context(from HomeScreen) to ProfileScreen(through constructor) and that work but when value changed of UserData it did not update the screen (guessing beacause of diffrent 'contexts')

What am I doing wrong in here,any Ideas?:S

Answer 1

Please make sure that you application's root widget is Provider Widget, it should event be the parent of MaterialWidget. If this is already the case I will need your code to look into. Something like this

class AppState {
 User loggedInUser;

 bool get isLoggedIn {
  return loggedInUser != null;
 }

 // Other states as per the requirements
 // ...
}

Answer 2

Providers are "scoped".

This means that if they are placed inside a screen, they aren't accessible outside that screen.

Which means that if a provider is scoped but needs to be accessed outside of the route it was created in, we have two solutions:

• un-scope the provider. This involves moving the provider to a common ancestor of both widgets that needs to obtain the value.

  If those two widgets are on two different Routes, then it basically mean "move the provider above MaterialApp/CupertinoApp.

• manually pass the provider to the new screen (needed when using Navigator.push)

  The idea is, instead of having one provider, we have two of them, both using the same value as explained here See How to scope a ChangeNotifier to some routes using Provider? for a practical example.

  For Navigator.push, this can look like:

  final myModel = Provider.of<MyModel>(context);
  Navigator.push(
    context,
    MaterialPageRoute(
      builder: (_) =>
        ChangeNotifierProvider.value(
          value: myModel,
          child: MyScreen(),
      ),
    ),
  );