Flutter通过构造函数传递arrMainCategories到第二页面失败排查

你遇到的传值为空是三个代码层面的硬伤叠加导致的，和接口请求逻辑本身无关：

• 异步时序不匹配：arrMainCategories是异步接口返回后才赋值的，初始值是空数组。如果在接口响应返回前就触发跳转，传入第二页面的自然是空值
• State类的参数接收写法完全不符合Flutter规范：Flutter的State对象是由框架自动创建的，你手动给State类写带参构造函数的方式，框架根本不会调用，等于完全没拿到传入的参数
• 路由跳转链路不完整：你写的NewCat(arrMainCategories: arrMainCategories)只是创建了Widget实例，没有通过Navigator完成页面路由跳转，实际的传值链路是断的

1. 调整跳转触发时机 #

必须等接口请求完成、arrMainCategories完成赋值后，再触发跳转动作。不要在接口还没返回时就构造目标页、执行跳转：

// 正确的跳转写法（一般放在分类组件的点击事件里）
onTap: () {
  // 先判断数据是否加载完成，避免传空
  if (arrMainCategories.isEmpty) return;
  Navigator.push(
    context,
    MaterialPageRoute(
      builder: (context) => NewCat(
        arrMainCategories: arrMainCategories,
      ),
    ),
  );
}

2. 修正第二页面的参数接收逻辑 #

删掉原来给State类写的自定义带参构造，Flutter中Widget传入的参数，所有State层都可以通过widget.参数名直接访问：

// 修正后的完整第二页面代码
class NewCat extends StatefulWidget {
  // Widget层的参数声明逻辑保持不变
  NewCat({Key? key, required this.arrMainCategories}) : super(key: key);
  final List arrMainCategories;

  @override
  _NewCatState createState() => _NewCatState();
}

class _NewCatState extends State<NewCat> {
  // 去掉原来的带参State构造，这里的内部变量直接从widget的参数赋值
  late List arrMainCategories;
  var arrCatImages = [];
  var arrCatName = [];

  @override
  void initState() {
    super.initState();
    // 在State初始化完成后，把Widget传入的参数赋值给内部变量即可
    arrMainCategories = widget.arrMainCategories;
  }
}

注意：原代码里给_State类写构造函数的写法是早期的错误遗留，框架在创建State实例时只会调用无参的默认构造，你自定义的带参构造从来不会被触发，自然接不到任何传入的值。

3. 多场景优化方案 #

如果后续有多个页面都需要用到这份全量接口数据，不需要每个页面层层手动传值，可以把全量数据放到全局单例容器里统一存储：

• 接口请求完成后，直接把全量数据更新到全局单例的存储对象中
• 所有需要使用这份数据的页面，直接从全局容器中读取，既避免了重复发起API请求，也不会出现异步时序导致的传空问题

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