Why ChangeNotifierProvider disappears from Widget Tree when using routes? - flutter

Question

I'm having trouble understanding this: When the ChangeNotifierProvider widget is below the MaterialApp one in the widget tree, it disappear from the widget tree when I use the Navigator.of(context).pushReplacement method to go to the next screen. However, when the ChangeNotifierProvider widget is above the MaterialApp one in the widget tree, it stays in the widget tree.
Here is a simple example below.
ChangeNotifierProvider widget that disappear example:
class MyApp extends StatelessWidget {
// This widget is the root of your application.
#override
Widget build(BuildContext context) {
return MaterialApp( <= DIFFERENCE HERE
title: 'Flutter Demo',
home: ChangeNotifierProvider(
create: (context) => ToiletsListModel(), child: SplashWidget()));
}
}
class SplashWidget extends StatefulWidget {
SplashWidget();
#override
State<SplashWidget> createState() => SplashWidgetState();
}
class SplashWidgetState extends State<SplashWidget> {
#override
Widget build(BuildContext context) {
return Scaffold(
body: ElevatedButton(
child: Text("press"),
onPressed: goNext,
),
);
}
goNext() async {
await Future.delayed(Duration(seconds: 3));
if (mounted) {
Navigator.of(context).pushReplacement(
MaterialPageRoute(builder: (BuildContext context) => HomeScreen()));
}
}
#override
void initState() {
super.initState();
[1, 2, 3, 4, 5].forEach((t) {
Provider.of<MyModel>(context, listen: false).mylist.add(t);
});
print(Provider.of<MyModel>(context, listen: false).mylist);
}
}
The widget tree:
ChangeNotifierProvider widget that stays example:
class MyApp extends StatelessWidget {
// This widget is the root of your application.
#override
Widget build(BuildContext context) {
return ChangeNotifierProvider( <= DIFFERENCE HERE
create: (context) => ToiletsListModel(),
child: MaterialApp(title: 'Flutter Demo', home: SplashWidget()));
}
}
class SplashWidget extends StatefulWidget {
SplashWidget();
#override
State<SplashWidget> createState() => SplashWidgetState();
}
class SplashWidgetState extends State<SplashWidget> {
#override
Widget build(BuildContext context) {
return Scaffold(
body: ElevatedButton(
child: Text("press"),
onPressed: goNext,
),
);
}
goNext() async {
await Future.delayed(Duration(seconds: 3));
if (mounted) {
Navigator.of(context).pushReplacement(
MaterialPageRoute(builder: (BuildContext context) => HomeScreen()));
}
}
#override
void initState() {
super.initState();
[1, 2, 3, 4, 5].forEach((t) {
Provider.of<MyModel>(context, listen: false).mylist.add(t);
});
print(Provider.of<MyModel>(context, listen: false).mylist);
}
}
The widget tree:
It makes me crazy and I can't find any answer. I suppose that pushReplacement() does something to the widget tree or that ChangeNotifierProvider is not persistent (altough I did not see that in the documentation, i'm not even sure it's possible tbh). Also, I read that using the ChangeNotifierProvider above the MaterialApp wasn't a good idea but I don't know why.
Thanks for your help.