Apollo GraphQL突变分别为列表中的每个项目加载

问题描述

我有一个待办事项清单：

• item1
• item2
• item3

每个项目都有一个删除按钮，带有删除单个项目的突变。 并且每个项目都有来自loading的{​​{1}}的微调框

问题： 一旦我按下单个项目上的删除按钮，微调器就会为列表中的每个项目打开。

我在这里知道问题所在，但不知道如何正确解决。 我们可以为列表的每个项目添加状态，并为打开微调器添加逻辑。

但是我正在这里寻找合适的解决方案。 也许有一种方法可以知道，该突变被称为什么参数，我将添加简单的代码

deleteMutation

解决方法

问题正在使用/共享同一突变实例，其状态为loading。下一个问题-可能无法同时删除两个项目。

可能的解决方案：

• 如果每个项目都有其自己的突变-使其成为组件（react中的廉价抽象），请在内部定义突变。当然有点多余-但适用于更复杂的项目或单个操作。

• ...或者您必须使用一些标志（状态），例如itemBeingDeleted，然后调用突变（在“ onCompleted”中清除）以阻止（禁用）其他项删除按钮并显示其中之一的加载情况。