Reactjs 阿波罗客户端3缓存不';突变后t更新

Reactjs 阿波罗客户端3缓存不';突变后t更新,reactjs,apollo-client,Reactjs,Apollo Client,首先,如果这是一个重复的问题,我想道歉,但类似问题中的现有答案都没有帮助我 我正在使用nextjs 9.5.3和apollo客户端3.2.2。我有一个表单,用户填写它来更新他们的个人资料详细信息。提交时,保存的数据保存在数据库中,并将响应返回给客户端。问题在于,响应无法更新缓存,但根据apollo devtools的说法,它可以在根变异中找到 我使用一个查询最初加载用户的数据,然后在变异期间用结果更新缓存。下面是本地查询和变异 //片段 export const editUserProfileF

首先,如果这是一个重复的问题,我想道歉,但类似问题中的现有答案都没有帮助我

我正在使用nextjs 9.5.3和apollo客户端3.2.2。我有一个表单,用户填写它来更新他们的个人资料详细信息。提交时,保存的数据保存在数据库中,并将响应返回给客户端。问题在于,响应无法更新缓存,但根据apollo devtools的说法,它可以在
根变异中找到

我使用一个查询最初加载用户的数据,然后在变异期间用结果更新缓存。下面是本地查询和变异

//片段
export const editUserProfileFragment=gql`
ProfileInterface上的片段EditUserProfileFields{
身份证件
类型
鼻涕虫
名称
位置{
名称
地址
国家
纬度
经度
}
设置
创建数据
活跃的
}
`;
//质疑
export const editUserProfileQuery=gql`
查询EditUserProfile($slug:String){
配置文件(slug:$slug){
…EditUserProfileFields
}
}
${editUserProfileFragment}
`;
//突变
export const editUserProfileSpection=gql`
用户配置文件($id:ObjectID!,$profile:ProfileInput!){
editProfile(id:$id,profile:$profile){
…EditUserProfileFields
}
}
${editUserProfileFragment}
`;
下面是我如何使用查询和变异:

//查询
const{error,data,loading}=useQuery(editUserProfileQuery{
变量:{slug},
fetchPolicy:“仅限网络”,
})
//数据返回一个'Profile'对象
//突变
const[editUserProfileMutate]=useMutation(editUserProfileMutation)
...
//保存数据
试一试{
const response=wait editUserProfile mutate({
变量:{id,profile:inputdata},
//更新:(缓存,{data})=>{
//const cachedData:any=cache.readQuery({
//查询:editUserProfileQuery,
//变量:{slug:newProfile.slug}
//   });
//const cacheId=cache.identify(data.editProfile)//要查看id,我想尝试cache.modify(),但不知道如何继续。
//log('update.cachedData',cachedData);
//log('update.cachedData.Profile',cachedData.Profile');
//console.log('update.data',data);
//const newData={…cachedData.Profile,…data.editProfile};//我第一次使用[],但是
//console.log('newData',newData);
////cache.writeQuery({
////查询:editUserProfileQuery,
////变量:{slug:newProfile.slug},
////数据:{editProfile:newData}
//   // })
////cache.modify({
////id:cacheId,
//   // })
// },
//尝试了下面的方法,但无效
//参考查询:[{
//查询:editProfilePageQuery,
//变量:{slug:newProfile.slug},
// }],
//等待查询:true
});
const updatedProfile=response.data.editProfile;
log('updatedProfile',updatedProfile);
....
}捕获(错误){
....
}//trycatch
此外,以下阿波罗客户机主要基于:

。。。
让我们的客户;
...
常量缓存=新的InMemoryCache({
// https://www.apollographql.com/docs/react/data/fragments/#using-具有联合和接口的片段
dataIdFromObject:result=>`${result.\uuuuTypeName}:${result.\uID | | | | | result.name | | result.slug | | Math.floor(Math.random()*1000000)`,
可能类型:{
ProfileInterface:[“星型”、“用户”],
},
//@见https://www.apollographql.com/docs/react/caching/cache-field-behavior/#merging-控制台警告中的非规范化对象
类型策略:
用户:{
字段:{
地点:{
合并(_现有,传入){
返回输入;
},
},
},
},
},
});
函数createClient(){
const link=makeLink();
返回新客户端({
隐藏物
链接
connectToDevTools:typeof窗口!=“未定义”,
ssrMode:typeof window===‘未定义’,
});
}
导出函数initializePollo(initialState=null){
const_apolloClient=apolloClient??createClient()
如果(初始状态){
const existingCache=\u apolloClient.extract()
log('existingCache',existingCache);
//_apolloClient.cache.restore({…existingCache,…initialState})//故意注释掉
_apolloClient.cache.restore(初始状态)
}
if(typeof window==='undefined')返回
如果(!Apollo客户端)Apollo客户端=\u Apollo客户端
返回(u)
}
导出函数UseAppollo(初始状态){
const store=useMemo(()=>InitializeAppollo({InitializeState}),[InitializeState])
退货商店
}

因此,在查看后端源代码后,我发现我没有从数据库返回更新的值,而是返回旧的值。我把它修好了,它正常工作了