如何从反应查询突变无效?

Question

我试图重新获取一个特定的数据，这应该在另一个API的post请求后更新。值得一提的是，基于该请求，两个api应该更新，其中一个更新，另一个不更新。

我尝试了多种方法来重新获取基于成功的post请求的API，但似乎没有工作。
我试着像这样添加第二个选项，但是没有成功。

{
refetchInactive: true,
refetchActive: true,
}

正如在这个讨论中提到的，也许键不匹配，所以你试图使缓存中不存在的东西无效。，但不确定这是我的情况。

更有趣的是，在devtools中单击invalidate按钮，invalidate本身可以工作。

突变功能:

import { BASE_URL, product1Url, product2Url } from './services/api'
import axios from 'axios'
import { useMutation, useQueryClient } from 'react-query'
export const usePostProduct3 = () => {
const queryClient = useQueryClient()
const mutation = useMutation(
async (data) => {
const url = `${BASE_URL}/product3`
return axios.post(url, data).then((response) => response)
},
{
onSuccess: async (data) => {
return (
await queryClient.invalidateQueries(['prodKey', product1Url]), //this one doesn't work
queryClient.invalidateQueries(['prodKey', product2Url]) //this api refetch/update works
)      },
},
)
return mutation
}

我做错了什么?

Answer 1

你应该这样做

onSuccess:(response)=>{
queryClient.setQueryData("your query key",response.data)
}

或者如果你只是想使查询无效

import {querCache} from "react-query"
...
onSuccess:(response)=>{
queryClient.invalidateQueries("your query key")

queryClient.invalidateQueries("your query key")
//you also can refetch data like this
queryCache.refetchQueries("your query key")
}