一.在风格组件MaterialApp内的routes可选参数中创建命名路由
MaterialApp{
..... //其他代码无关
home: MyHomePage()
routes{ //在routes中注册路由
"new_SearchPage":(context) => newPage() //注册一个路由器名称
}
}
提示:"new_SearchPage" 是命名路由的名称。
二.在点击按钮的时候,响应Push路由器跳转
class MyHomePage extends StatelessWidget {
const MyHomePage({super.key});
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: ElevatedButton(
onPressed: () {
Navigator.pushNamed(context, "new_SearchPage", arguments: "helloRoute");
},
child: Text("页面传参")),
));
}
}
提示:context 记录widget分枝节点操作信息,便于widget遍历执行
routeName 路由器名称
arguments 传值(可选参数)
三.在对应Widget内接收参数并且使用。
class newPage extends StatelessWidget {
const newPage({super.key});
@override
Widget build(BuildContext context) {
var args = ModalRoute.of(context)?.settings.arguments; //接收参数
return Scaffold(
appBar: AppBar(
title: Text("${args}"),
),
body: Text("welcome to RoutePage"),
);
}
}
提示:ModalRoute.of(context) 获取跳转路由,settings路由的设置,内有arguments传值和name命名路由的名称。