React query mutations
Hi guys I wrote this custom function in react-query to simplify my code
but when i try to call it inside onsubmit in formik
It throws this error
can you guys correct me if I write this fuction wrong, Thank you
import { useMutation, useQuery } from '@tanstack/react-query';
import userRequest from '@/utils/AxiosInstance';
export const usePostQuery = <TResponse, TBody>(
queryKey: string,
url: string,
body: TBody
) => {
return useMutation({
mutationKey: [queryKey],
mutationFn: async () => {
const { data } = await userRequest.post(url, body);
return data as TResponse;
},
onSuccess: (data: TResponse) => {
console.log(data);
},
onError: (err) => {
console.error(err);
},
});
};import { useMutation, useQuery } from '@tanstack/react-query';
import userRequest from '@/utils/AxiosInstance';
export const usePostQuery = <TResponse, TBody>(
queryKey: string,
url: string,
body: TBody
) => {
return useMutation({
mutationKey: [queryKey],
mutationFn: async () => {
const { data } = await userRequest.post(url, body);
return data as TResponse;
},
onSuccess: (data: TResponse) => {
console.log(data);
},
onError: (err) => {
console.error(err);
},
});
};but when i try to call it inside onsubmit in formik
onSubmit={(values) => {
const data = usePostQuery();
}}onSubmit={(values) => {
const data = usePostQuery();
}}It throws this error
React Hook "usePostQuery" cannot be called inside a callback. React Hooks must be called in a React function component or a custom React Hook function.eslintreact-hooks/rules-of-hooks
Expected 3 arguments, but got 0.ts(2554)
postQuery.ts(5, 3): An argument for 'queryKey' was not provided.
(alias) usePostQuery<unknown, unknown>(queryKey: string, url: string, body: unknown): UseMutationResult<unknown, unknown, void, unknown>
import usePostQueryReact Hook "usePostQuery" cannot be called inside a callback. React Hooks must be called in a React function component or a custom React Hook function.eslintreact-hooks/rules-of-hooks
Expected 3 arguments, but got 0.ts(2554)
postQuery.ts(5, 3): An argument for 'queryKey' was not provided.
(alias) usePostQuery<unknown, unknown>(queryKey: string, url: string, body: unknown): UseMutationResult<unknown, unknown, void, unknown>
import usePostQuerycan you guys correct me if I write this fuction wrong, Thank you