问题描述
从A页面跳转到B页面后，在B页面操作后，退出B页面时回到A页面时返回一些数据给A页面
A页面下的跳转
ElevatedButton( child: const Text("载入设置"), onPressed: () { // List<Task> data = await _dbProvider.getAll(); _dbProvider.getAll().then((value) => { // 跳转到新页面 Navigator.push(context, MaterialPageRoute(builder: (context) { return TaskListPage(value,(index){ // Navigator.push(context, ...) // 根据 index 跳转 print("index=$index"); }); // 传入 Task 列表 })) }); }, ),
新页面
// 新页面 class TaskListPage extends StatelessWidget { final List<Task> tasks; // TaskListPage(this.tasks); TaskListPage(this.tasks, this.onTaskTap); final Function onTaskTap; @override Widget build(BuildContext context) { // 根据 Task 数量动态生成 ElevatedButton List<Widget> buttons = tasks.map((task) { return ElevatedButton( style: ElevatedButton.styleFrom( backgroundColor: Colors.blue, shape: CircleBorder(), ), child: Column( mainAxisAlignment: MainAxisAlignment.center, //居中对齐 children: [ Icon(Icons.people), Text(task.title) ] ), onPressed: () { // 点击事件 onTaskTap(tasks.indexOf(task)); Navigator.of(context).pop(); } ); }).toList(); // 使用 GridView 实现网格布局 return Scaffold( body: GridView.count( crossAxisCount: 3, children: buttons, padding: EdgeInsets.fromLTRB(10,40,20,10), // 添加 20 的内边距 // padding: EdgeInsets.symmetric(horizontal: 20), crossAxisSpacing: 20 , // 设置行列间距为 20 ) ); } }
主要步骤说明
1、B页面中在TaskListPage 类中添加构造函数TaskListPage(this.tasks, this.onTaskTap);
final Function onTaskTap;
2、A页面在跳转到B页面时，传入要接受数据的变量
return TaskListPage(value,(index){ // Navigator.push(context, ...) // 根据 index 跳转 print("index=$index"); }); // 传入 Task 列表
结果
点击B页面从数据库里读取出来的数据后，会返回告知A页面，点击了第几个
这只是一个简单的方式，推荐使用Provider， Provider是一个 Flutter 官方推荐的状态管理方案,主要用于在 Widget 树中传递数据。
