Stateful Widget中build方法已调用但列表项未更新，滚动时才更新？

核心原因分析 #

这种情况大概率是子Stateful Widget的状态没有随父组件传递的数据更新——哪怕父组件的build触发了，子组件要么没触发build，要么内部缓存了旧数据，没同步新内容。而滚动列表时，列表项被复用或重新创建，才强制触发了状态更新。

具体解决步骤 #

1. 修复子Widget的状态同步逻辑 #

如果子Widget在initState里初始化了依赖父组件传入的数据，必须在didUpdateWidget方法里同步更新本地状态：

class ItemWidget extends StatefulWidget {
  final ItemData data;
  const ItemWidget({super.key, required this.data});

  @override
  State<ItemWidget> createState() => _ItemWidgetState();
}

class _ItemWidgetState extends State<ItemWidget> {
  late String displayText;

  @override
  void initState() {
    super.initState();
    displayText = widget.data.text;
  }

  @override
  void didUpdateWidget(covariant ItemWidget oldWidget) {
    super.didUpdateWidget(oldWidget);
    // 父组件传入的数据变化时，更新本地状态
    if (oldWidget.data != widget.data) {
      displayText = widget.data.text;
    }
  }

  @override
  Widget build(BuildContext context) {
    return Text(displayText);
  }
}

2. 给列表项绑定正确的唯一Key #

不要用UniqueKey()这类每次重建都变的Key，要绑定到列表项的数据唯一标识（比如id），确保数据变化时Key能反映差异：

ListView.builder(
  itemCount: dataList.length,
  itemBuilder: (context, index) {
    final item = dataList[index];
    // 用数据的唯一id作为Key，而非固定值或随机Key
    return ItemWidget(key: ValueKey(item.id), data: item);
  },
)

3. 尽量简化子Widget的状态 #

如果子Widget的内容完全依赖父组件传递的数据，直接改成Stateless Widget，这样父组件数据变化时，子Widget会自动重建：

class ItemWidget extends StatelessWidget {
  final ItemData data;
  const ItemWidget({super.key, required this.data});

  @override
  Widget build(BuildContext context) {
    return Text(data.text);
  }
}

4. 确保父组件的数据更新能触发重建 #

如果父组件用的是可变列表（比如List），直接修改列表元素不会触发状态更新（因为列表引用没变化），必须创建新的列表实例：

// 错误：直接修改元素，列表引用不变，无法触发重建
dataList[index].text = "新内容";
setState(() {});

// 正确：创建新列表，改变引用触发重建
setState(() {
  dataList = List.from(dataList)..[index].text = "新内容";
});

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