Home > Back-end >  how to call reactQuery refetch in input onchange event in reactjs
how to call reactQuery refetch in input onchange event in reactjs

Time:12-09

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

CodePudding user response:

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 });
  • Related