Navigator.push(): Error: Could not find the correct Provider above this Consumer Widget

Issue

Im trying to implement some basic state management in my Flutter app. Somewhere up the Widget tree I have a Provider for a User. Widgets further down can access the User using the Consumer User Widget. However one Widget (WidgetB in the code snipped below) is build using the Navigator.push() and cant access the User. Pushing the Button will throw the Error:

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

floatingActionButton: FloatingActionButton(
          child: Icon(Icons.play),
          onPressed: () {
            Navigator.push(
              context,
              MaterialPageRoute(
                builder: (context) => Consumer<User>(
                  builder: (context, user, child) => WidgetB(user: user),
                ),
              ),
            );
          },
        ),

How can I access the user in WidgetB (or in some child Widget of WidgetB)?

Solution

Make sure that your providers are set at the MaterialApp level. For example, like this:

void main() {
  runApp(MultiProvider(
    providers: [
      ChangeNotifierProvider(
        create: (_) => Provider1(),
      ),
      ChangeNotifierProvider(
        create: (_) => Provider2(),
      ),
    ],
    child: MyApp(),
  ));
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MainPage(),
    );
  }
}

Answered By – mskolnick

Answer Checked By – Terry (FlutterFixes Volunteer)