当我有 Nested 时,我遇到了这个问题Navigator
。所以像,
class App extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
initialRoute: "/",
routes: {
'/': (context) => SomeOneView(),
'/two': (context) => SomeTwoView(),
'/three': (context) => SomeThreeView(),
},
);
}
}
class SomeOneView extends StatefulWidget {
@override
_SomeOneViewState createState() => _SomeOneViewState();
}
class _SomeOneViewState extends State<SomeOneView> {
@override
Widget build(BuildContext context) {
return Container(
width: double.infinity,
height: double.infinity,
color: Colors.indigo,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
MaterialButton(
color: Colors.white,
child: Text('Next'),
onPressed: () => Navigator.of(context).pushNamed('/two'),
),
],
),
);
}
}
class SomeTwoView extends StatefulWidget {
@override
_SomeTwoViewState createState() => _SomeTwoViewState();
}
class _SomeTwoViewState extends State<SomeTwoView> {
@override
Widget build(BuildContext context) {
return WillPopScope(
onWillPop: () async {
// Some implementation
},
child: Navigator(
initialRoute: "two/home",
onGenerateRoute: (RouteSettings settings) {
WidgetBuilder builder;
switch (settings.name) {
case "two/home":
builder = (BuildContext context) => HomeOfTwo();
break;
case "two/nextpage":
builder = (BuildContext context) => PageTwoOfTwo();
break;
}
return MaterialPageRoute(builder: builder, settings: settings);
},
),
);
}
}
class HomeOfTwo extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Container(
width: double.infinity,
height: double.infinity,
color: Colors.white,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
MaterialButton(
color: Colors.white,
child: Text('Next'),
onPressed: () => Navigator.of(context).pushNamed('two/nextpage'),
),
],
),
);
}
}
class PageTwoOfTwo extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Container(
width: double.infinity,
height: double.infinity,
color: Colors.teal,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
MaterialButton(
child: Text('Next'),
onPressed: () => Navigator.of(context).pushNamed('/three'),
),
],
),
);
}
}
如您所见,我从Navigator
提供的 Top MostMaterialApp
向下导航到 childNavigator
的'two/nextpage'
,然后应该转到MaterialApp
'/three'
. 问题是 do 会onPressed: () => Navigator.of(context).pushNamed('/three'),
返回Navigator
当前context
的 child Navigator
。我需要访问MaterialApp
'sNavigator
才能正确导航。这样做的正确方法是什么?
另外如何处理Navigator
我要访问的情况是在一堆Navigator
s 中间的某个地方?