调试帮助：从视图中滚动出来后，Flutter StatefulWidget不会保持状态

Question

我正在玩一个简单的应用程序来学习Flutter。 这是UI的结构：

app -- MaterialApp -- HomeScreen (stateful) |- ListView -- PlaceWidget (stateful) |- ListTile

PlaceWidget对象基本上会构建并返回一个ListTile。 它唯一的附加职责是跟踪favorited状态并相应地构建ListTile的UI。

源代码在这里 ，包括两个文件：

• 整个应用程序的main.dart ，以及
• http请求的places.dart

该应用的行为方式如下： https : //gfycat.com/FineBelovedLeafhopper

---

从表面上看，当滚动到视线之外时，似乎对象的状态丢失了，但是其他一些调试日志告诉我。

假设我最喜欢Oto Sushi，然后在屏幕外滚动它，但保持指向状态对象的指针，则该对象的favorited状态仍然为true 。 但是，据报告对象本身（类_PlaceWidgetState ） defunct, not mounted 。
我无法再与该对象互动。 如果再点击一次Oto Sushi ，它将创建一个新的状态对象，并将该对象的favorited状态设置为true ，就像以前一样。

只要不在屏幕外滚动Oto Sushi ，我就不会喜欢它，并且一切正常。

我设法通过TextInputField和ExpansionTile找到了类似的问题（例如， 这个问题 ），但是我不知道如何将这些问题的解决方案转化为这个问题。

Answer 1

因此，除了架构讨论之外，问题的原因在于如何构造State对象。 通过将数据传递给构造函数，可以确保每次重新构建窗口小部件时，它们的状态都将重置。

 class PlaceWidget extends StatefulWidget {
  @override
  _PlaceWidgetState createState() {
    return new _PlaceWidgetState(place, false); // woops, always unchecked
  }

  final Place place;
  PlaceWidget(this.place, {Key key}) : super(key: key);
}

class _PlaceWidgetState extends State<PlaceWidget> { ... }

与其执行此操作，不如使用状态小部件内的widget getter来访问place成员。 另外，请确保仅在“状态”小部件内初始化您checked状态-或从此处的某些外部来源获取它。

class _PlaceWidgetState extends State<PlaceWidget> {
  bool _isChecked = false; // only store state in State

  Widget build() {
   final Place place = widget.place;
   // build your stuff.
  }
}

现在，您的小部件不断重建的原因是在ListView ，屏幕外的小部件可能会被破坏-它是为非常大的列表设计的。 为了防止这种情况，您还可以使用KeepAlive小部件。