为什么Flutter中async函数处理后，外部传入的列表没有保存请求数据？

核心原因 #

• 变量传递逻辑问题：Dart采用值传递规则，你定义的displayMenu函数接收的data参数是外部全局data变量的拷贝，函数内部直接给data参数赋值的操作，只会修改局部变量的值，完全不会同步到外部的全局data变量。
• 异步执行顺序问题：displayMenu是异步函数，调用时如果不加await，程序不会等待内部HTTP请求完成，就会直接执行后面的print(data)语句，此时请求还没返回结果，自然打印的还是初始的空列表。

修正代码 #

方案1：直接操作全局变量 #

List data = [];

// 不需要传入data参数，直接操作全局变量
Future<void> displayMenu() async {
  var response = await http.get(Uri.http("10.0.2.2:3000", "api/menu"));
  if (response.statusCode == 200) {
    data = jsonDecode(response.body);
  }
}

// 调用时加await等待异步函数执行完成
await displayMenu();
print(data);

方案2：接收函数返回值赋值（更推荐，避免全局变量耦合） #

List data = [];

Future<List?> displayMenu() async {
  var response = await http.get(Uri.http("10.0.2.2:3000", "api/menu"));
  if (response.statusCode == 200) {
    return jsonDecode(response.body);
  }
  return null;
}

// 等待执行完成后把返回值赋值给外部data
data = await displayMenu() ?? [];
print(data);

特殊场景适配 #

如果你的调用代码写在不支持async/await的同步方法里，可以用then方法处理异步结果：

displayMenu().then((result) {
  data = result ?? [];
  print(data);
  // 拿到数据后再执行后续UI更新等操作
});

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