Flutter：使用Navigator.pop()后如何通过setState重建HomeScreen

场景1：传递更新后的完整列表 #

在HomeScreen中，跳转时通过await接收EditScreen返回的更新后的数据，再调用setState更新：

// HomeScreen中跳转的代码
onTap: () async {
  // selectedIndex为当前点击的Holiday的下标
  final updatedList = await Navigator.push(
    context,
    MaterialPageRoute(
      builder: (context) => EditScreen(
        holidays: holidays,
        targetIndex: selectedIndex,
      ),
    ),
  );
  
  if (updatedList != null) {
    setState(() {
      holidays = updatedList;
    });
  }
}

在EditScreen中，修改数据后将更新后的列表作为返回值传递：

// EditScreen中修改完成后的代码
void saveChanges() {
  // 修改指定下标的start字段
  setState(() {
    holidays[targetIndex].start = newStartValue;
  });
  // 返回更新后的列表给HomeScreen
  Navigator.pop(context, holidays);
}

场景2：直接修改列表内对象的属性（列表引用不变） #

如果holidays是可变列表，且修改的是列表中对象的属性（而非替换整个列表），可以在HomeScreen的跳转完成后，直接调用setState触发重新构建：

// HomeScreen中跳转的代码
onTap: () {
  Navigator.push(
    context,
    MaterialPageRoute(
      builder: (context) => EditScreen(
        holidays: holidays,
        targetIndex: selectedIndex,
      ),
    ),
  ).then((_) {
    // 跳转返回后，强制触发HomeScreen重新构建
    setState(() {});
  });
}

在EditScreen中，直接修改对象属性后pop即可：

// EditScreen中修改完成后的代码
void saveChanges() {
  holidays[targetIndex].start = newStartValue;
  Navigator.pop(context);
}

原理说明 #

EditScreen中的setState只会刷新自身UI，HomeScreen的状态不会被自动触发更新。通过上述两种方式，要么传递更新后的数据让HomeScreen替换原有数据并刷新，要么在返回后主动触发HomeScreen的setState，让它重新渲染列表，从而展示更新后的数据。

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