所有项目的 Apollo 客户端特定更新查询？答案

【问题标题】：Apollo client specific updatequery for all items?所有项目的 Apollo 客户端特定更新查询？
【发布时间】：2017-09-19 12:14:19
【问题描述】：

我有两个具有以下关系的模型：

群组有很多链接

所以基本上我的初始查询是 getAllGroups，它获取所有组及其链接。我有一个简单地创建链接的突变，更新我的 UI 的最有效方法是什么？

目前我有：

export const withCreateLink = graphql(createLink, {
props({ownProps, mutate}) {
    return {
        createLink(url, description, group) {
            return mutate({
                variables: {
                    url,
                    description,
                    group
                },
                updateQueries: {
                    getAllGroups: (prev, {mutationResult}) => {
                        const newLink = mutationResult.data.createLink;
                        return update(prev, {
                            allGroups: {
                                links: {
                                    $push: [newLink]
                                }
                            }
                        })
                    }
                }
            })
        }
    }
}
});

基本上我只想获取添加了链接的组，但我需要指定是哪个组。我该怎么办？

【问题讨论】：

所以你想添加一个特定组的链接？因为现在您将新链接添加到所有组
是的，但我想我已经想通了。我可以从我的道具接收组索引，然后在我的查询中使用该索引：allGroups: { [groupIndex]: { links: {...} }}。正确的？我将其添加为答案。感谢您的评论。
是的，看起来是正确的方法

标签： reactjs graphql apollo react-apollo

【解决方案1】：

我已经想通了，在以这种方式创建其他突变的同时，我发现了一些不同的方法来解决这个问题：

选项 1： 如果您有权访问缓存中当前模型的索引，则可以将其作为道具传递，然后在查询中使用它来定位已添加到其中的模型：

                updateQueries: {
                getAllGroups: (prev, {mutationResult}) => {
                    const newLink = mutationResult.data.createLink;
                    return update(prev, {
                        allGroups: {
                            [groupIndex]:
                              links: {
                                 $push: [newLink]
                              }
                        }
                    })
                }
            }

选项 2： 使用 update 而不是 updateQueries，因此您可以读取根查询的结果，对其进行映射，然后附加新插入的数据。之后就可以写入缓存了。

                    update: (proxy, mutationResult) => {
                    const query = getAllGroups;
                    const data = proxy.readQuery({query});

                    data.allGroups.map((groupData) => {
                        if(groupData.id == group)
                            groupData.links.push(mutationResult.data.createLink);
                    });

                    proxy.writeQuery({
                        query,
                        data
                    })
                }

【讨论】：