目录一、命名路由传参二、构建路由传参第一种方式:第二种方式:Flutter中的默认导航分成两种,一种是命名的路由,一种是构建路由。 一、命名路由传参 应用入口处定义路由表 class
Flutter中的默认导航分成两种,一种是命名的路由,一种是构建路由。
应用入口处定义路由表
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false, // 隐藏预览中的debug
title: 'Flutter Demo',
routes: {
'/': (context) => const HomePage(),
"menu": (context) => const MenuPage()
},
);
}
}
// 定义HomePage
class HomePage extends StatelessWidget {
const HomePage({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text("登录"),
),
body: ElevatedButton(
onPressed: () async {
// 实现路由跳转
var result = await Navigator.pushNamed(context, 'menu',
arguments: {'name': 'title'});
print(result);
},
child: const Text('登录'),
),
);
}
}
// 定义MenuPage
class MenuPage extends StatelessWidget {
const MenuPage({Key? key}) : super(key: key);
@override
// 接收传参
Widget build(BuildContext context) {
dynamic argumentsData = ModalRoute.of(context)?.settings.arguments;
return Scaffold(
appBar: AppBar(
title: Text('菜单' + argumentsData.toString()),
),
body: ElevatedButton(
onPressed: () {
Navigator.pop(context, {'name': "Navigator.pop传参"});
},
child: const Text("返回"),
),
);
}
}
从HomePage页面跳转MenuPage页面时,携带参数
// 定义HomePage
class HomePage extends StatelessWidget {
const HomePage ({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text("登录"),
),
body: ElevatedButton(
onPressed: () {
// 实现路由跳转
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => const MenuPage(
title: '菜单123',
), // 需要跳转的页面
), // 修改路由的名称、信息等
);
},
child: const Text('登录'),
),
);
}
}
// 定义MenuPage
class MenuPage extends StatelessWidget {
// 定义接收的字段
final String title;
const MenuPage({Key? key, required this.title}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(title),
),
body: ElevatedButton(
onPressed: () {
Navigator.pop(context);
},
child: const Text("返回"),
),
);
}
}
// 定义HomePage
class HomePage extends StatelessWidget {
const HomePage({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text("登录"),
),
body: ElevatedButton(
onPressed: () {
// 实现路由跳转
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => const MenuPage(),
// 修改路由的名称、信息等
settings: const RouteSettings(
name: '菜单', arguments: {"name": '123'}) // 需要跳转的页面
),
);
},
child: const Text('登录'),
),
);
}
}
// 定义MenuPage
class MenuPage extends StatelessWidget {
const MenuPage({Key? key}) : super(key: key);
@override
// 接收传参
Widget build(BuildContext context) {
dynamic argumentsData = ModalRoute.of(context)?.settings.arguments;
return Scaffold(
appBar: AppBar(
title: Text('菜单' + argumentsData.toString()),
),
body: ElevatedButton(
onPressed: () {
Navigator.pop(context);
},
child: const Text("返回"),
),
);
}
}
从MenuPage页面返回HomePage页面时,携带参数
// 定义HomePage
class HomePage extends StatelessWidget {
const HomePage ({Key? key}) : super(key: key);;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text("登录"),
),
body: ElevatedButton(
onPressed: () async {
// 实现路由跳转
var result = await Navigator.push(
context,
MaterialPageRoute(
builder: (context) => const MenuPage(),
),
);
print(result);
},
child: const Text('登录'),
),
);
}
}
// 定义MenuPage
class MenuPage extends StatelessWidget {
const MenuPage({Key? key}) : super(key: key);
@override
// 接收传参
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('菜单'),
),
body: ElevatedButton(
onPressed: () {
Navigator.pop(context, {'name': "Navigator.pop传参"});
},
child: const Text("返回"),
),
);
}
}
到此这篇关于Flutter Navigator路由传参的实现的文章就介绍到这了,更多相关Flutter Navigator路由传参内容请搜索编程网以前的文章或继续浏览下面的相关文章希望大家以后多多支持编程网!
--结束END--
本文标题: FlutterNavigator路由传参的实现
本文链接: https://www.lsjlt.com/news/146857.html(转载时请注明来源链接)
有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341
下载Word文档到电脑,方便收藏和打印~
2024-01-21
2023-10-28
2023-10-28
2023-10-27
2023-10-27
2023-10-27
2023-10-27
回答
回答
回答
回答
回答
回答
回答
回答
回答
回答
一口价域名售卖能注册吗?域名是网站的标识,简短且易于记忆,为在线用户提供了访问我们网站的简单路径。一口价是在域名交易中一种常见的模式,而这种通常是针对已经被注册的域名转售给其他人的一种方式。
一口价域名买卖的过程通常包括以下几个步骤:
1.寻找:买家需要在域名售卖平台上找到心仪的一口价域名。平台通常会为每个可售的域名提供详细的描述,包括价格、年龄、流
443px" 443px) https://www.west.cn/docs/wp-content/uploads/2024/04/SEO图片294.jpg https://www.west.cn/docs/wp-content/uploads/2024/04/SEO图片294-768x413.jpg 域名售卖 域名一口价售卖 游戏音频 赋值/切片 框架优势 评估指南 项目规模
0