从 ListView.Builder 中删除项目总是会删除 Flutter 中的最后一个项目答案

【问题标题】：Removing item from ListView.Builder always removes the last item in Flutter从 ListView.Builder 中删除项目总是会删除 Flutter 中的最后一个项目
【发布时间】：2022-08-05 18:00:17
【问题描述】：

当我试图删除一个项目时，每次最后一项被删除。搜索解决方案后，我发现它与有状态小部件一起工作，解决方案是在小部件中添加键。

所以我添加了密钥，但问题并没有消失。最后一项仍会被删除. 贝娄，我试图尽可能详细地展示情况。最后，您将看到，当我删除 index(0) 处的项目时，它会被调用，但 index(1) 会从 UI 中释放。但在列表中，第一项已正确删除。

这是 ListView.builder

                     ListView.builder(
                        primary: false,
                        shrinkWrap: true,
                        scrollDirection: Axis.vertical,
                        physics: const NeverScrollableScrollPhysics(),
                        itemCount: saleItems.length,
                        itemBuilder: (BuildContext context, int index) {
                          print(\'Value key: ${ValueKey(index)}\');
                          return ProductItemWidget(
                            key: ValueKey(index),
                            itemContext: context,
                            mainItems: batches,
                            onDelete: () {
                              setState(() {
                                saleItems.remove(saleItems[index]);
                                print(
                                    \'deleted $index - value ${ValueKey(index)}\');
                                print(saleItems);
                              });
                            },
                            onNewSaleItem: (newItem) {
                              setState(() {
                                saleItems[index] = newItem;
                              });
                              print(saleItems);
                            },
                          );
                        },
                      ),

将新项目添加到列表中

SizedBox(
                        key: _addButtonKey,
                        child: KFilledButton(
                          text: \'New Sale Item\',
                          onPressed: () {
                            setState(() {
                              saleItems.add(newSaleItemModal);
                            });
                            scrollToAddButton();
                          },
                        ),
                      ),

项目和列表的实例

  NewSaleItemModal newSaleItemModal = NewSaleItemModal();
  List<NewSaleItemModal> saleItems = [];

ProductItemWidget() 页面

这是构造函数

class ProductItemWidget extends StatefulWidget {
  void Function() onDelete;
  List<dynamic>? mainItems;
  BuildContext? itemContext;
  Function(NewSaleItemModal newSaleItem) onNewSaleItem;
  ProductItemWidget({
    Key? key,
    required this.onDelete,
    required this.onNewSaleItem,
    this.mainItems,
    this.itemContext,
  }) : super(key: key);

  @override
  State<ProductItemWidget> createState() => _ProductItemWidgetState();
}

这些是状态

  @override
  void initState() {
    super.initState();
    print(\'Created with key: ${widget.key}\');
  }

  @override
  void didChangeDependencies() {
    types = profileRepository.getConfigEnums(type: EnumType.discountType);
    getAllProductNames();
    super.didChangeDependencies();
  }

  @override
  void dispose() {
    super.dispose();
    print(\'Disposed key: ${widget.key}\');
    selectedProductName = null;
    selectedProduct = null;
    selectedType = null;
    _discountController.dispose();
    _rateController.dispose();
    _quantityController.dispose();
    _unitController.dispose();
    _amountController.dispose();
  }

这是我添加密钥的地方

 @override
  Widget build(BuildContext itemContext) {
    return Form(
      key: widget.key,
      child: ..........
      ),
     }

添加第一项后，在控制台中...

I/flutter (17380): Value key: [<0>]
I/flutter (17380): Created with key: [<0>]
I/flutter (17380): [NewSaleItemModal(productId: 23, batchId: 88, rate: 35567, quantity: 1, unitId: 1, discount: 0, discountType: null, amount: 35567)]

添加第二项后，在控制台中...

I/flutter (17380): Value key: [<1>]
I/flutter (17380): Created with key: [<1>]
I/flutter (17380): [NewSaleItemModal(productId: 23, batchId: 88, rate: 35567, quantity: 1, unitId: 1, discount: 0, discountType: null, amount: 35567), NewSaleItemModal(productId: 4, batchId: 69, rate: 1158, quantity: 1, unitId: 1, discount: 0, discountType: null, amount: 1158)]

Here is the video deleting the first item

当我删除第一个项目时，在控制台中......

I/flutter (17380): deleted 0 - value [<0>]
I/flutter (17380): [NewSaleItemModal(productId: 4, batchId: 69, rate: 1158, quantity: 1, unitId: 1, discount: 0, discountType: null, amount: 1158)]

I/flutter (17380): Value key: [<0>]
I/flutter (17380): Disposed key: [<1>]

标签： flutter listview listitem statefulwidget

【解决方案1】：

嗯，尝试使用 removeWhere 来确定要删除的项目

saleItems.removeWhere((e)=> e.productId == saleItems[index].productId);

【讨论】：

谢谢你。但我认为我不能使用 productId 作为参考，因为 productId 在选择产品之前将为空。最初，将创建字段，但字段的值为空。
你试过只在remove里面传递索引吗？像这样？saleItems.remove（索引）；
是的。但它不会删除任何东西。

【解决方案2】：

我面临同样的问题。你是怎么解决的？

【讨论】：

这没有提供问题的答案。您可以search for similar questions，或参考页面右侧的相关和链接问题找到答案。如果您有一个相关但不同的问题，ask a new question，并包含指向此问题的链接以帮助提供上下文。见：Ask questions, get answers, no distractions