Flutter修改todoFutureBuilder刷新Column时仍显示旧数据如何解决

• 核心错误是你直接将Widget实例存储在todoFutureBuilder列表中，Flutter的Widget是不可变对象，框架做增量更新时无法正确识别你手动操作Widget列表带来的变更，就会出现旧Widget残留、新Widget叠加的问题。
• 你在showSearchArtistResults中连续调用了两次setState，虽然Flutter会合并更新请求，但删除、添加操作拆分执行的时序问题也可能导致列表更新异常。
• 布局嵌套错误：外层Column已经用Expanded包裹，内部FutureBuilder返回的组件又套了一层Expanded，布局约束冲突会导致内容渲染异常，看起来像是旧数据没有被刷新。

Flutter遵循数据驱动UI的渲染逻辑，不要直接存储和操作Widget列表，改为存储业务数据，在build方法中根据数据动态生成Widget即可，修改后的代码参考如下：

1. 状态定义改为存储业务数据 #

// 废弃存储Widget的列表，改为存储搜索结果状态和数据
String? searchResultState;

2. 修正build逻辑，动态生成组件 #

@override
Widget build(BuildContext context) {
  return Scaffold(
    body: Column(
      children: [
        getSearchBar(),
        Expanded(
          child: Column(
            children: [
              const Text('This is result'),
              // 按照数据状态动态渲染搜索结果区域
              if (searchResultState != null)
                FutureBuilder(
                  future: getSearchArtistResultList(),
                  builder: (context, snapshot) {
                    if (snapshot.hasData) {
                      if (snapshot.data == 'have_result') {
                        return Expanded(child: buildArtistResultList());
                      } else {
                        return const Text('No Result, Please Search Again');
                      }
                    } else if (snapshot.hasError) {
                      return Text("${snapshot.error}");
                    }
                    return const CircularProgressIndicator();
                  },
                )
            ],
          ),
        )
      ],
    ),
  );
}

3. 简化更新逻辑，只修改业务数据 #

showSearchArtistResults() {
  setState(() {
    // 切换数据状态触发UI刷新即可，不需要手动操作Widget列表
    searchResultState = 'trigger_search';
  });
}

如果一定要保留操作Widget列表的写法，需要保证每次修改列表时都完全替换旧的列表实例，而不是在原有列表上做增删，比如todoFutureBuilder = List.from(todoFutureBuilder)..removeAt(1)..add(新Widget)，让框架识别到列表实例变更触发完全刷新，但这种写法不推荐，维护成本很高。

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