Reactjs 从阿波罗缓存中添加/删除项目,更改缓存数据顺序

Reactjs 从阿波罗缓存中添加/删除项目,更改缓存数据顺序,reactjs,graphql,apollo,react-apollo,Reactjs,Graphql,Apollo,React Apollo,我想知道做以下事情的最佳方式(如果可能的话)是什么: 例如,让我们设想一个包含两个列表的页面:所有系列和收藏夹系列。我通过此查询从服务器获取按评级排序的列表: query { series { id name rating } user { id name favoriteSeries { id name rating } } } 现在,当用户将“所有系列”列表中的某个系列标记为收藏夹时

我想知道做以下事情的最佳方式(如果可能的话)是什么:

例如,让我们设想一个包含两个列表的页面:所有系列和收藏夹系列。我通过此查询从服务器获取按评级排序的列表:

query {
  series {
    id
    name
    rating
  }
  user {
    id
    name
    favoriteSeries {
      id
      name
      rating
    }
  }
}
现在,当用户将“所有系列”列表中的某个系列标记为收藏夹时,应将其从“所有”列表中删除,并按其评级顺序添加到“收藏夹”列表中。因此,当用户单击按钮时,就会发生变异,我必须使用变异的“更新”字段来处理缓存中的更改。我知道我应该使用
readQuery
writeQuery
readFragment
writeFragment
来完成这项任务,但我无法决定哪个更好

一方面,我可以使用
readQuery
。在这种情况下,我可以很容易地从一个数组中删除一个序列并将其放入另一个数组中,但是如果我在这里进行分页并更改查询道具会怎么样?我应该使用什么查询从缓存中获取所有数据

另一方面,我可以使用
readFragment
获得我想要通过其id移动的确切序列。在这种情况下,我不知道如何将其关系更改为“所有”和“收藏”列表。另外,我不明白在这两种情况下如何管理缓存顺序