1

In my React application, I need to call does exit API. API call should happen when change event in the input for that, I am using the reactQuery refetch to do that.

I had tried with below code

const [createObj, setCreateObj] = useState(mCreateObj);

const { data: doexit, refetch: doexitRefetch } = useQuery('getDoexit', () => api.doexitAPI(createObj.c_name), { enabled: false });

const handleInput = ({ target: { name, value } }) => { setCreateObj(state => ({ ...state, [name]: value }), []); }

export const doexitAPI= (value) => axios.get(/doexist/${value}, { headers: setHeader }).then(res => res);

useEffect(() => { console.log(createObj) doexitRefetch(); }, [createObj.mx_name])

How to call in input onchange event

Improve this question

2 Answers 2

Reset to default
2

You can invalidate your query and handle fetch data again with query keys.

https://react-query.tanstack.com/guides/query-keys#if-your-query-function-depends-on-a-variable-include-it-in-your-query-key

const { data: doexit, refetch: doexitRefetch } = useQuery(['getDoexit',  createObj.mx_name], () => api.doexitAPI(createObj.c_name), { enabled: false });
Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

0

You can include the input in your query key, for example if bar is your input

useQuery([endpoints.foo, bar], queryFn);
Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.