Flutter路由跳转（页面跳转）

1. 指定页面名称跳转Navigator.of(context).push(MaterialPageRoute()

class TextPage extends StatelessWidget {const TextPage({Key? key}) : super(key: key);@overrideWidget build(BuildContext context) => MaterialApp(home: Scaffold(body: Center(child: TextButton(child: const Text(';跳转'),onPressed: () {Navigator.of(context).push(MaterialPageRoute(builder: (context) {				//返回要跳转的目标页面return _WillPopApp();}));},),),));
}

2.指定路由名称跳转。

• 首先要注册路由名称：

//运行runApp(MaterialApp(routes: {//   //注册路由表"cartPage": (context) => const CartWidget(),'home': (context) => const HomeWidget(),},

• 通过路由名称跳转

 ElevatedButton(child: const Text('命名的方式跳转'),onPressed: () {//路由命名的方式跳转到指定以页面Navigator.pushNamed(context, "product",//传递过去的数据arguments: '我是传递的数据')//返回的数据.then((value) {setState(() {cartResult = value.toString();print('返回的数据=$value');});});},),

3.通过onGenerateRoute方法实现页面拦截

比如在跳转个人中心或者结算订单的场景需要用户登录后才可执行后续操作onGenerateRoute方法在使用路由名称跳转的时候如果你使用的目标名称没有注册就会调用此方法

示例：onGenerateRoute方法判断

//如果使用命名的方式跳转，如果跳转的路由名称没有注册就会调用这个方法//可以利用这个方式拦截页面的跳转，比如说验证是否已登录onGenerateRoute: (RouteSettings settings) {return MaterialPageRoute(builder: (context) {if (isLogin) {switch (settings.name) {case "cartPage":return const CartWidget();case "product":return const ProductWidget(productName: '我是通过命名传递过来的');default:return const HomeWidget();}} else {return const LoginWidget();}});},

实现跳转：

ElevatedButton(child: const Text('命名的方式跳转'),onPressed: () {//路由命名的方式跳转到指定以页面Navigator.pushNamed(context, "cartPage",//传递过去的数据arguments: '我是传递的数据')//返回的数据.then((value) {setState(() {cartResult = value.toString();print('返回的数据=$value');});});},),

退出页面

IconButton(icon: const Icon(Icons.arrow_back),onPressed: () {Navigator.pop(context, '我返回数据给你了');},),

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！