flutter - 如何获取列表中小部件的索引？

问题描述

我应该如何实现删除功能有点困惑。

通过点击底部按钮，将自定义卡片小部件添加到顶部显示的小部件列表中

这是它的功能

onTap: () {
                  setState(() {
                    _variationCards.add(VariationCard(
                      key: UniqueKey(),
                      variation: Variation.empty,
                      index: _variationCards.length,
                      onRemoveCard: (index) {
                        setState(() {
                          _variationCards.removeAt(index);
                        });
                      },
                    ));
                  });
                },

当前设置的问题是

假设我删除了第二张卡片，现在第三张卡片变成了第二张卡片，但是我传递给第三张卡片小部件的索引仍然是 2，而现在它实际上是 1。
我需要卡片小部件中的索引，因为我需要为第一张卡片添加额外的小部件，但现在如果我删除第一张卡片，第二张卡片的索引值将不会更新。

我想我正在走向错误的道路来实现这一点。任何帮助将非常感激。

提前谢谢你。

标签： flutterdart

主要信息应该是您定义的类/模型而不是小部件的列表。您希望小部件根据应用中的基础信息/状态进行更新（重建）。目前，您的小部件已创建并添加到您的手势列表中（如onTap），并且不会自行更新 - 这就是您的情况下索引“错误”的原因。

我建议在使用ListView.builder变体时结合代表卡片的类/模型：

代表您的卡的类：

/// Currently only holds the Variation enum value, add whatever
/// defines your cards later on
class VariationModel {
  Variation variation;

  VariationModel(this.variation)
}

您在列表中显示卡片的小部件：

/// Need to be filled with instances of this class, maybe passed
/// down directly to this widget or grabbed from something like
/// GetIt or Provider etc.
List<VariationModel> _variations;

@override
Widget build(BuildContext context) {
  ...
  ListView.builder(
    /// +1 to include the button to add a new card at the end
    itemCount: _variations.length + 1,
    itemBuilder: (context, index) => index < _variations.length ?
      VariationCard(
        key: UniqueKey(),
        variation: _variations[index].variation,
        index: index,
        onRemoveCard: () {
          setState(() {
            _variations.removeAt(index);
          });
        },
      /// Add your widget (card) here which is used to add a new
      /// new card (in this case a new VariationModel instance)
      ) : Card(
            ...
            onTap: () {
              setState(() {
                _variations.add(VariationModel(Variation.empty));
              });
            },
          ),
  ),
}

由于这种方法使用的是ListView.builder动态构建孩子（您的卡片小部件）的小部件，并且由于小部件现在要重建，因此索引正在正确更新，因此它应该按您的意图工作。

flutter - 如何获取列表中小部件的索引？

问题描述

解决方案

推荐阅读