Flutter 2.5.3出现Undefined name错误如何解决？变量作用域逻辑排查

问题根源：块级作用域限制 #

报错的核心原因是Dart遵循块级作用域规则：

• 你定义final recipes = snapshot.data?.todayRecipes ?? [];的位置，处于if (snapshot.connectionState == ConnectionState.done) {}的代码块内部，该变量的可访问范围仅被限制在当前if块的大括号包裹区域，出了这个块就会被销毁，外部无法读取。
• 你调用return TodayRecipeListView(recipes: recipes);的位置属于else代码块，完全不在recipes的作用域范围内，自然会触发变量未定义的报错。

修复方案 #

方案1：将变量定义提升到if判断外层 #

直接在if判断前完成recipes的定义，让它的作用域覆盖整个builder函数内部，两个分支都可以正常访问：

@override
Widget build(BuildContext context) {
  return FutureBuilder(
    future: mockService.getExploreData(),
    builder: (context, AsyncSnapshot<ExploreData> snapshot) {
      // 变量定义移到if外层，作用域覆盖整个builder
      final recipes = snapshot.data?.todayRecipes ?? [];
      if (snapshot.connectionState == ConnectionState.done) {
        // 加载完成分支也可以正常访问recipes
        return Center(
          child: Container(
            child: const Text('Show TodayRecipeListView'),
          ),
        );
      } else {
        return TodayRecipeListView(recipes: recipes);
      }
    },
  );
}

方案2：分块定义变量（不推荐） #

如果加载中、加载完成两个分支需要使用不同的食谱数据源，也可以分别在if和else块内各自定义recipes变量，但会产生冗余代码，不推荐使用。

业务逻辑修正建议 #

你当前的代码逻辑本身存在不合理的地方：else分支对应的是Future还在加载的状态，此时snapshot.data默认是空值，正常场景下加载中应该返回加载指示器而非列表组件，大概率是你把两个分支的返回值写反了，调整后更符合业务逻辑的代码如下：

builder: (context, AsyncSnapshot<ExploreData> snapshot) {
  if (snapshot.connectionState == ConnectionState.done) {
    final recipes = snapshot.data?.todayRecipes ?? [];
    // 加载完成后再返回食谱列表
    return TodayRecipeListView(recipes: recipes);
  } else {
    // 加载中返回加载动画
    return const Center(
      child: CircularProgressIndicator(),
    );
  }
}

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