dart - 在 Flutter 中保存项目列表的状态

Question

我在处理项目列表的状态时遇到了一些问题。我想保存每个项目的状态，以及整个列表的一些状态。对我的实现有什么想法或指导吗？错误标记为“###”。谢谢。另外，如何格式化一组粘贴的代码行？ ctrl-K 只是把它们吹走了，添加 pre/code 标签仍然会收到红色投诉。我只是在每行中添加了 4 个空格以使其正常工作。

class TruffleListScreenList extends StatefulWidget {
  @override
  TruffleListScreenListState createState() {
    return TruffleListScreenListState();
  }
}

class TruffleListScreenListState extends State<TruffleListScreenList> {
  List<TruffleItemState> truffleItems = [
    TruffleItemState("chocolate", "images/IMG_1252.JPG"),
    TruffleItemState("mint", "images/IMG_1253.JPG"),
    TruffleItemState("tooti-frutti", "images/IMG_1254.JPG"),
    TruffleItemState("peanut butter", "images/IMG_1255.JPG"),
  ];

  @override
  Widget build(BuildContext context) {
    return ListView(
      children: truffleItems,   ### The argument type 'List TruffleItemState' can't be assigned to the parameter type 'List Widget'
    );
  }
}

class TruffleItem extends StatefulWidget {
  @override
  TruffleItemState createState() {
    return TruffleItemState();   ### 2 required argument(s) expected, but 0 found.
  }
}

class TruffleItemState extends State<TruffleItem> {
  String name;
  String imageFile;
  int qty;
  bool add;

  TruffleItemState(this.name, this.imageFile);

  @override
  Widget build(BuildContext context) {  // build a row of stuff as a list item
    return Row(

    );
  }
}

Answer 1

小部件的结构看起来不错:一个用于列表，一个用于每个列表项。

下一步是为每个 TruffleItem 创建一个 Widget 列表，并在 ListView 的子项中使用它。为此，您需要在 List 类上使用 map 函数。此外，根据我的经验，您必须两次传递参数。一次用于 StatefulWidget，然后复制到 State。

您的代码应如下所示:

class TruffleListScreenList extends StatefulWidget {
  @override
  TruffleListScreenListState createState() {
    return TruffleListScreenListState();
  }
}

class TruffleListScreenListState extends State<TruffleListScreenList> {
  List<TruffleItemState> truffleItems = [
    TruffleItemState("chocolate", "images/IMG_1252.JPG"),
    TruffleItemState("mint", "images/IMG_1253.JPG"),
    TruffleItemState("tooti-frutti", "images/IMG_1254.JPG"),
    TruffleItemState("peanut butter", "images/IMG_1255.JPG"),
  ];

  @override
  Widget build(BuildContext context) {
    return ListView(
        // Map each item to a widget, then turn into a list.
        children: truffleItems.map((item) => TruffleItem(item.name, item.imageFile)).toList(),
    );
  }
}

class TruffleItem extends StatefulWidget {
  final String name;
  final String imageFile;

  TruffleItem(this.name, this.imageFile);

  @override
  TruffleItemState createState() {
    return TruffleItemState();
  }
}

class TruffleItemState extends State<TruffleItem> {
  int qty;
  bool add;

  TruffleItemState();

  @override
  Widget build(BuildContext context) {  // build a row of stuff as a list item
    return Row(
        // Use the variables like widget.name or widget.imageFile
    );
  }
}

正如 Richard Heap 在评论中所说:

"Don't pass the name and imageFile down to TruffleItemState. Instead, you can access them from there as widget.name and widget.imageFile respectively."