一种不使用导航，仅仅改变content即可。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/10435.html
这样做的好处是，不需要来回处理导航和路由那么个复杂的东西。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/10435.html
1. 准备工作文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/10435.html
新建四个页面，Cart、JD、Taobiao、Settings。这里仅放一下Cart的代码，其他类似.文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/10435.html
文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/10435.html
文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/10435.html
import 'package:flutter/';
class Cart extends StatelessWidget{
@override
Widget build(BuildContext context){
returnnew Center(
child: Text('Cart'),
);
}
}2. 添加页面引用文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/10435.html
由于我放在了同级目录，仅作演示。所以引用如下文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/10435.html
import './'; import './'; import './'; import './';
实际项目不建议这么操作，可以新建一个pages文件夹，放进去。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/10435.html
3. 新建一个空页面，并添加一个drawer，加入四个ListTile，分别是Cart、JD、Taobiao、Settings文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/10435.html
void main() => runApp(new MaterialApp(
home: new NavDrawer(),
));
class NavDrawer extends StatefulWidget {
@override
_NavDrawerState createState() => new _NavDrawerState();
}
class _NavDrawerState extends State<NavDrawer> {
@override
initState() {
();
}
@override
Widget build(BuildContext context) {
returnnew Scaffold(
appBar: new AppBar(),
drawer: new Drawer(
child: new ListView(
children: <Widget>[
new ListTile(
title: new Text("Cart"),
trailing: new Icon(),
),
new ListTile(
title: new Text("JD"),
trailing: new Icon(),
),
new ListTile(
title: new Text("Taobiao"),
trailing: new Icon(),
),
new ListTile(
title: new Text("Settings"),
trailing: new Icon(),
)
],
),
),
body: new Container(
),
);
}
}可以看到我们并没有添加onTap事件，还有Scaffold的body是空的，暂时没有设置。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/10435.html
4. 添加点击事件文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/10435.html
这里仅演示Cart的点击代码，其他类似文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/10435.html
onTap: () {
setState(() {
content = Cart();
(context);
});
},里面有一个Cart()赋值给了content，所以需要在类_NavDrawerState的最开始定义一下文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/10435.html
同时使用了setState方法，来通知框架content的值已改变。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/10435.html
文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/10435.html
5. 设置Scaffold的内容文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/10435.html
body: new Container(
child: content,
),6. 运行调试Flutter文章源自菜鸟学院-https://www.cainiaoxueyuan.com/xcx/10435.html