如何解决问题：使用 Bloc 时“已关闭的 Dismissible 小部件仍然是树的一部分”

Question

在实现Dismissible小部件时，我在删除项目时出错。

    return Dismissible(
      key: Key(widget.product.id),
      onDismissed: (direction) {
        setState(() {
          BlocProvider.of<ManagerBloc>(context)
              .add(RemoveProduct(widget.product));
        });

这个孩子的父母看起来像

          return ListView.builder(
              itemCount: state.shopItem.length,
              itemBuilder: (BuildContext context, int index) {
                return ProductElement(product: state.shopItem[index]);
              });
        }

我将它移到父级并使用 blocProvider 删除shopItem.removeAt()但我仍然得到了这个问题。 即使我在列表中使用remove删除了 object，它也会显示相同的错误消息：

    if (event is RemoveProduct) {
      await shopListRepository.remove(event.product);
      yield DefaultDataManager((state as DefaultDataManager)
          .shopItem
          .where((item) => item.id != event.product.id)
          .toList());
    }

我尝试了 UniqueKey，结果是一样的。 我的 product_id 是由 uuid.v1() 生成的 '64b7ff60-f782-11e9-a3e8-a9ee0aa87ea5'。

Answer 1

我认为问题在于您没有删除数据 model ，其列表在调用onDismissed之后（同步）生成 UI。 假设您在小部件的State中有一个List<Item> _items ，它存储填充列表的 UI 数据 model。 为了使Dismissible工作，您必须做的是在调用onDismissed时同步调用 State 中的State _items.remove(item) 。

因此，不要在两者之间await ，也不要简单地从存储库中删除项目，也要从实际的State中删除它（我特别告诉你这一点，因为我可以看到你正在做await shopListRepository.remove(event.product) ）。