Javascript Apollo GraphQL合并缓存数据
我有一个由2个组件组成的页面,每个组件都有自己的数据请求 比如说Javascript Apollo GraphQL合并缓存数据,javascript,reactjs,caching,graphql,apollo,Javascript,Reactjs,Caching,Graphql,Apollo,我有一个由2个组件组成的页面,每个组件都有自己的数据请求 比如说 <MovieInfo movieId={queryParamsId}/> const GET_MOVIE_INFO = `gql query($id: String!){ movie(id: $id){ name description } }` const GET_MOVIE_INFO=`gql 查询($id:String!){ 电影(id:$id){ 名称 描述 } }` 下一个
<MovieInfo movieId={queryParamsId}/>
const GET_MOVIE_INFO = `gql
query($id: String!){
movie(id: $id){
name
description
}
}`
const GET_MOVIE_INFO=`gql
查询($id:String!){
电影(id:$id){
名称
描述
}
}`
下一个组件
<MovieActors movieId={queryParamsId}/>
const GET_MOVIE_ACTORS = `gql
query($id: String!){
movie(id: $id){
actors
}
}`
const GET_MOVIE_ACTORS=`gql
查询($id:String!){
电影(id:$id){
演员
}
}`
对于每个查询,我都使用apollo hook
const{data,loading,error}=useQuery(GET_data,{variable:{id:queryParamsId}}))
一切正常,但我收到一条警告信息:
替换查询对象的“电影”字段时,缓存数据可能会丢失。
要解决此问题(这不是Apollo客户端中的错误),请确保所有类型为Movie的对象都有ID,或者为Query.Movie字段定义一个自定义合并函数,以便InMemoryCache可以安全地合并这些对象:{…}
google chrome可以正常工作,但这个错误会影响Safari浏览器。一切都是毁灭性的。我百分之百肯定是因为这个警告信息。在第一个请求中,我在缓存中设置了电影数据,在对同一查询的第二个请求中,我只是用新数据替换旧数据,因此以前的缓存数据是未定义的。如何解决此问题?已解决
cache: new InMemoryCache({
typePolicies: {
Query: {
fields: {
YOUR_FIELD: {
merge(existing = [], incoming: any) {
return { ...existing, ...incoming };
// this part of code is depends what you actually need to do, in my
case i had to save my incoming data as single object in cache
}
}
}
}
}
})
});
与我们的模式相比,数据值的不一致性也存在同样的问题。实体中的值类型缺少id值。由不完整的数据迁移导致 临时解决办法:
const typePolicies = {
PROBLEM_TYPE: {
keyFields: false as false,
},
PARENT_TYPE: {
fields: {
PROBLEM_FIELD: {
merge: true
}
}
}
}
这是Thomas提到的相同解决方案,但略短一些
const cache = new InMemoryCache({
typePolicies: {
Query: {
fields: {
YOUR_FIELD: {
merge: true,
},
},
},
},
});
换句话说:“您查询(请求的)
电影
[type]应该包含id
属性”(除了名称
、描述
或演员
)-否则它不能缓存-[您可以使用其他命名的唯一字段和转换函数]-缓存就是这样工作的,它需要唯一的对象“确保电影类型的所有对象都有id”非常清楚,在两个查询中使用id
是否sameI有类似的问题,我正在两个查询中重新调整id,但这对我不起作用@xadm@xadm我的男人…在我看到你的评论之前就要开始拉我的头发了。