Flutter开发：如何在多屏来回切换后保留表格内的列表数据？

你现在每次跳转第二屏，都是重新构建一个全新的Episode5页面实例，而用来存表单数据的userList是写在Episode5的State内部的——每次新实例创建，这个列表就会被初始硬编码的3条测试值覆盖，你之前新增的自定义数据会跟着旧实例一起被销毁，自然就消失了。

把userList的存储位置从第二屏的页面State，挪到第一屏的公共State里，让列表数据不跟着第二屏的销毁重建走，实现跨页面的持久化保留。

• 第一步：在第一屏（_MyAppState）里定义全局共享的userList，作为跨页面的统一数据源
• 第二步：给Episode5页面加构造参数，接收第一屏传进来的已有列表，删掉第二屏自己硬编码的初始列表定义
• 第三步：第二屏操作完返回第一屏时，把更新后的列表回传给第一屏，覆盖第一屏存的全局数据，保证下次跳转拿到的是最新值

1. 第一屏_MyAppState修改：
   • 新增全局userList存储，替换原来只打日志的返回逻辑

   class _MyAppState extends State<MyApp> {
     // 全局存用户列表，作为跨页面的统一数据源
     List<User> userList = [
       User(name: "a", email: "a"),
       User(name: "d", email: "b"),
       User(name: "c", email: "c"),
     ];
     String _userInformation = 'No information yet';
   
     void languageInformation() async {
       final updatedUserList = await Navigator.push(
         context,
         MaterialPageRoute(
           // 跳转时把当前全局存的列表传给第二屏
           builder: (context) => Episode5(initialList: userList),
         ),
       );
       // 拿到第二屏返回的更新后列表，更新全局数据和展示内容
       if (updatedUserList != null) {
         setState(() {
           userList = List<User>.from(updatedUserList);
           // 同步更新第一屏的展示文本
           _userInformation = userList.map((user) => "姓名：${user.name}，邮箱：${user.email}").join("\n");
         });
       }
     }
   
     // 原来的build方法、按钮逻辑保持不变
   }
   

2. 第二屏Episode5修改：
   • 加构造参数接收外部传入的初始列表，删掉自己内部硬编码的列表初始化逻辑

   class Episode5 extends StatefulWidget {
     // 新增构造参数，接收第一屏传进来的初始列表
     final List<User> initialList;
     const Episode5({Key? key, required this.initialList}) : super(key: key);
   
     @override
     _Episode5State createState() => _Episode5State();
   }
   
   class _Episode5State extends State<Episode5> {
     TextEditingController nameController = TextEditingController();
     TextEditingController emailController = TextEditingController();
     final form = GlobalKey<FormState>();
     static var _focusNode = new FocusNode();
     bool update = false;
     int currentIndex = 0;
   
     // 删掉原来自己硬编码的userList，初始化时从传入的参数取数据
     late List<User> userList = List<User>.from(widget.initialList);
   
     // 剩下的DataTable渲染、addUserToList、updateForm、表单校验等逻辑完全不用改动
   }
   

改完之后，不管来回切换多少次屏幕：

• 第一次进第二屏，会拿到第一屏存的3条初始硬编码数据
• 你在第二屏新增、修改的内容，会在返回时同步回第一屏的全局存储
• 下次再从第一屏跳第二屏，拿到的是已经被你修改过的最新列表，不会重置回初始的硬编码状态

如果后续页面变多、共享数据变复杂，可以换成Provider、Riverpod这类状态管理方案，本质也是把共享数据放到独立于页面组件的全局域里，避免跟着页面销毁丢失。

内容的提问来源于stack exchange，提问作者newbie dev