Flutter: Inherited Widget and Routes Flutter: Inherited Widget and Routes flutter flutter

Flutter: Inherited Widget and Routes


I had the same problem for a long time and I realized that if you wrap the MaterialApp with the Inherited Widget, your data is accessible through the entire app. But in your case, you need to pass data after the user login so to do that you need to create a new Navigator and wrap it with your Inherited Widget. You can see this project https://github.com/johnstef99/inherited-widget-demo

import 'package:flutter/material.dart';void main() => runApp(MyApp());class MyApp extends StatelessWidget {  @override  Widget build(BuildContext context) {    return MaterialApp(      title: 'InheritedWidget Demo',      theme: ThemeData(        primarySwatch: Colors.blue,      ),      home: MyNav(),    );  }}Route generatePage(child) {  return MaterialPageRoute(builder: (context) => child);}class MyNav extends StatelessWidget {  @override  Widget build(BuildContext context) {    return MyData(      data: 'omg',      child: Navigator(        onGenerateRoute: (settings) {          switch (settings.name) {            case 'page1':              return generatePage(PageOne());            case 'page2':              return generatePage(PageTwo());            case 'page3':              return generatePage(PageThree());          }        },        initialRoute: 'page1',      ),    );  }}class MyData extends InheritedWidget {  MyData({Key key, this.child, this.data}) : super(key: key, child: child);  final Widget child;  final String data;  static MyData of(BuildContext context) {    return (context.inheritFromWidgetOfExactType(MyData) as MyData);  }  @override  bool updateShouldNotify(MyData oldWidget) {    return true;  }}class PageOne extends StatelessWidget {  @override  Widget build(BuildContext context) {    return Scaffold(      appBar: AppBar(        title: Text('Page 1'),      ),      backgroundColor: Colors.red,      body: RaisedButton(        child: Text("Goto page 2, data=${MyData.of(context).data}"),        onPressed: () {          Navigator.of(context)              .push(MaterialPageRoute(builder: (_) => PageTwo()));        },      ),    );  }}class PageTwo extends StatelessWidget {  @override  Widget build(BuildContext context) {    return Scaffold(      appBar: AppBar(        title: Text('Page 2'),      ),      backgroundColor: Colors.red,      body: RaisedButton(        child: Text("Goto page 3, data=${MyData.of(context).data}"),        onPressed: () {          Navigator.of(context)              .push(MaterialPageRoute(builder: (_) => PageThree()));        },      ),    );  }}class PageThree extends StatelessWidget {  @override  Widget build(BuildContext context) {    return Scaffold(      appBar: AppBar(        title: Text('Page 3'),      ),      backgroundColor: Colors.green,      body: RaisedButton(        child: Text("Goto page 4, data=${MyData.of(context).data}"),        onPressed: null,      ),    );  }}


That is because you're trying to access CoolApp which is in the route / from another route (dynamic).

But inside your dynamic route, there's no CoolApp. So CoolApp.of(context) returns null, and therefore accessing .data crashes.

You need to find a way to have a CoolApp instance inside your new route.

For more informations, take a look at Get access to the context of InheritedWidget