我正在接收api调用中的数据,并将该数据重新构造为在表中正确显示。当用户单击按钮时,我试图创建该记录的副本。我已经完成了所有的工作,它只是没有用附加的数据更新表,或者删除(用于删除)数据。直到我通过浏览器刷新页面之后。
在refetchQueries之后调用函数可以吗?
const {
loading: appLoading,
data: applicationsData,
refetch: refetchApplicationsData,
} = useQuery(applications.operations.GET_APPLICATIONS_BY_COMPANY, {
client: applications.client,
variables: { companyId: userDetails.companyId },
})
const [
CloneApplication,
{ loading: cloneLoading, data: cloneData, error: cloneError },
] = useMutation(applications.operations.CLONE_APPLICATION_BY_COMPANY, {
client: applications.client,
onCompleted: () => {
refetchApplicationsData
},
})
useEffect(() => {
if (applicationsData && templatesList) {
const newFinalData = getFinalData({
applicationsList: applicationsData.getApplicationsByCompany,
templatesList: templatesList,
})
console.log('oldFinalData: ', finalData)
console.log('newFinalData: ', newFinalData)
setFinalData(newFinalData)
console.log('updatedFinalData: ', finalData)
}
}, [applicationsData, templatesList])
const cloneAndRefresh = (applicationId, companyId, ucId) => {
CloneApplication({
variables: {
applicationId: applicationId,
companyId: companyId,
ucId: ucId,
},
}).then(({ data: responseData }) => {
if (responseData) {
console.log('response data: ', responseData)
console.log('applications: ', applicationsData)
}
})
}
重组数据的职能:
export function getFinalData(request: {
templatesList: GetAllTemplate[]
applicationsList: GetApplicationsByCompany[]
}): FinalDataResponse[] {
const templates = request.templatesList.map((template) => {
const applicationsForTemplate = request.applicationsList.filter(
(app) => app.templateId === template.templateId
)
return { ...template, applications: applicationsForTemplate }
})
const groupedData = _.chain(templates)
.groupBy('templateId')
.map((value, key) => {
const templateName = _.chain(value)
.groupBy('templateName')
.map((value, key) => key)
.value()
const createdDate = _.chain(value)
.groupBy('dateCreated')
.map((value, key) => dayjs(key).format('ll'))
.value()
const lastModified = _.chain(value)
.groupBy('lastModified')
.map((value, key) => dayjs(key).format('ll'))
.value()
return {
templateId: key,
templateName: templateName[0],
createdDate: createdDate[0],
lastModified: lastModified[0],
applications: value[0].applications,
}
})
.value()
const finalData = groupedData.map((object, index) => {
return {
...object,
totalApplications: object.applications.length,
}
})
console.log('returning final data: ', finalData)
return finalData
}
我想我试图在重取查询之后重新运行getFinalData
,然后将它保存到状态,它应该重新呈现表吗?
编辑:我用新代码更新了我的查询,尽管它不太有效。如果有可能从重取查询中获取数据,我想我可以让它正常工作。我假设重取查询会因此更新applicationsData
,但我认为没有吗?
发布于 2022-04-03 17:18:34
默认情况下,useQuery钩子检查阿波罗客户端缓存,以查看所请求的所有数据是否已在本地可用。如果所有数据都在本地可用,useQuery将返回该数据,并且不会查询您的GraphQL服务器。这个缓存优先策略是阿波罗客户端的默认获取策略。如果您说您将在变异后调用handleRefresh(),那么下面的代码将运行良好。
const {
loading: appLoading,
data: applicationsData,
refetch: refetchApplicationsData,
} = useQuery(applications.operations.GET_APPLICATIONS_BY_COMPANY, {
client: applications.client,
variables: { companyId: userDetails.companyId },
fetchPolicy: "network-only",
})
https://stackoverflow.com/questions/71727477
复制相似问题