英文:
Auto-refetch a mutation by invalidating its tag from another mutation
问题
我可以在下面的代码中通过使其标签失效来自动重新获取getEmployees
变异吗?
现在当我调用deleteEmployee
变异时,getEmployees
变异不会运行。
我知道我应该使用GET请求从服务器获取数据,但由于一些安全性问题,这无法更改。
英文:
Can I auto-refetch getEmployees
mutation by invalidating its tag from another mutation called deleteEmployee
in the code below?
import { createApi } from '@reduxjs/toolkit/query/react'
import customFetchBase from './customFetchBase.js'
export const publicApi = createApi({
reducerPath: 'publicApi',
baseQuery: customFetchBase,
tagTypes: ['employees'],
endpoints: builder => ({
getEmployees: builder.mutation({
query: ({
formData = "defaultHashedDataString",
salt = "xyz",
pageIndex = 1
}) => ({
url: '/Hafez/Employee/Data',
method: 'POST',
body: {
RequestVerificationToken: salt,
FormData: formData,
currentPage: pageIndex + 1
}
}),
providesTags: ['employees']
}),
deleteEmployee: builder.mutation({
query: ({ formData, salt }) => ({
url: '/Hafez/Employee/Delete',
method: 'POST',
body: { RequestVerificationToken: salt, FormData: formData }
}),
invalidatesTags: ['employees']
})
})
})
export const { useGetEmployeesMutation, useDeleteEmployeeMutation } = publicApi
Now when I call deleteEmployee
mutation the getEmployees
mutation does not run.
I know that I should use a GET request for getting data from server but for some security it can't be changed.
答案1
得分: 0
查询提供标签,突变使其失效。我觉得 getEmployees
应该是一个查询而不是一个突变。当成功使 "employees"
标签失效时,调用 deleteEmployee
端点,那么任何当前订阅 now useGetEmployeesQuery
钩子的订阅者将自动触发 getEmployees
查询进行重新获取。
export const publicApi = createApi({
reducerPath: 'publicApi',
baseQuery: customFetchBase,
tagTypes: ['employees'],
endpoints: builder => ({
getEmployees: builder.query({ // <-- 更新为查询
query: ({
formData = "defaultHashedDataString",
salt = "xyz",
pageIndex = 1
}) => ({
url: '/Hafez/Employee/Data',
method: 'POST',
body: {
RequestVerificationToken: salt,
FormData: formData,
currentPage: pageIndex + 1
}
}),
providesTags: ['employees']
}),
deleteEmployee: builder.mutation({
query: ({ formData, salt }) => ({
url: '/Hafez/Employee/Delete',
method: 'POST',
body: { RequestVerificationToken: salt, FormData: formData }
}),
invalidatesTags: ['employees']
})
})
});
export const {
useGetEmployeesQuery, // <-- 更新后的钩子名称
useDeleteEmployeeMutation
} = publicApi;
请注意,端点可以是查询或突变,这与请求方法完全独立,例如 GET
、POST
、PUT
等。
英文:
Queries provide tags, mutations invalidate them. It seems to me that getEmployees
should be a query instead of a mutation. When the deleteEmployee
endpoint is called and successfully invalidates the "employees"
tag, then any current subscribers to the now useGetEmployeesQuery
hook will automatically trigger the getEmployees
query to refetch.
export const publicApi = createApi({
reducerPath: 'publicApi',
baseQuery: customFetchBase,
tagTypes: ['employees'],
endpoints: builder => ({
getEmployees: builder.query({ // <-- update to query
query: ({
formData = "defaultHashedDataString",
salt = "xyz",
pageIndex = 1
}) => ({
url: '/Hafez/Employee/Data',
method: 'POST',
body: {
RequestVerificationToken: salt,
FormData: formData,
currentPage: pageIndex + 1
}
}),
providesTags: ['employees']
}),
deleteEmployee: builder.mutation({
query: ({ formData, salt }) => ({
url: '/Hafez/Employee/Delete',
method: 'POST',
body: { RequestVerificationToken: salt, FormData: formData }
}),
invalidatesTags: ['employees']
})
})
});
export const {
useGetEmployeesQuery, // <-- updated hook name
useDeleteEmployeeMutation
} = publicApi;
Please note that the endpoints are either queries or mutations and that this is completely independent from the request method, e.g. GET
, POST
, PUT
, etc.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论