score:0
Accepted answer
as your useeffect
calls getrecipes();
react is indicating that getrecipes
is a dependency on this useeffect hook.
you could update with effect with:
useeffect(() => {
getrecipes();
}, [query, getrecipes]);
however you will get
the 'getrecipes' function makes the dependencies of useeffect hook (at line 18) change on every render. move it inside the useeffect callback. alternatively, wrap the 'getrecipes' definition into its own usecallback() hook. (react-hooks/exhaustive-deps)
so you can update to:
useeffect(() => {
const getrecipes = async () => {
const response = await fetch(
`https://api.edamam.com/search?q=${query}&app_id=${app_id}&app_key=${app_key}`
);
const data = await response.json();
setrecipes(data.hits);
console.log(data.hits);
};
getrecipes();
}, [query]);
which indicates this effect will be called, when query
is modified, which means getrecipes call the api with query
.
Source: stackoverflow.com
Related Query
- React Hook useEffect Error missing dependency
- How to fix missing dependency warning when using useEffect React Hook
- React Hook useEffect has missing dependencies. Either include them or remove the dependency array
- React Hook useEffect has a missing dependency: 'dispatch'. Either include it or remove the dependency array react-hooks/exhaustive-deps
- react hook useeffect has missing dependencies: yyy. either include them or remove the dependency array react-hooks/exhaustive-deps
- React | React Hook useEffect has a missing dependency
- React Hook useEffect has missing dependencies: 'colors' and 'options'. Either include them or remove the dependency array
- React Hook useEffect has a missing dependency when passing empty array as second argument
- React Hook useEffect has a missing dependency Props
- React Hook useEffect has a missing dependency array
- React Hook useEffect has a missing dependency: 'formData'. Either include it or remove the dependency array. what is dependency is use
- React warning React Hook useEffect has a missing dependency when the deps are []
- React Hook useEffect has a missing dependency: 'props'. Either include it or remove the dependency array. props in useEffect have no data
- React Hook useEffect has a missing dependency with useEffect
- warning: React Hook useEffect has a missing dependency
- React Hook useEffect while adding a missing dependency goes into endless loop
- React Hook useEffect has a missing dependency: 'fetchData'. Either include it or remove the dependency array
- React Hook useEffect has a missing dependency: 'handleLogout'. Either include it or remove the dependency array react
- React useEffect hook has a missing dependency warning
- React Hook useEffect has a missing dependency: 'loading'. Either include it or remove the dependency array react-hooks/exhaustive-deps
- React Hook useEffect has a missing dependency with Useeffect hook. Is it bad practice to ignore this warning?
- React useEffect warning to put missing dependency. But dependency value changes in the hook
- Missing dependency linting error on React hook
- React Hook useEffect has a missing dependency. Either include it or remove the dependency array react-hooks/exhaustive-deps
- React Hook useEffect has a missing dependency Either include it or remove the dependency array react-hooks/exhaustive-deps
- React Hook useEffect has a missing dependency
- React Hook useEffect has a missing dependency: 'evaluate'. Either include it or remove the dependency array
- React Hook useEffect has a missing dependency: 'location.state'. Either include it or remove the dependency array react-hooks/exhaustive-deps
- React Hook useEffect has a missing dependency: 'refreshDisplay'. Either include it or remove the dependency array
- React Hook useEffect has a missing dependency for redux action as parameters
More Query from same tag
- React CASL conditions not working in production mode - Reactjs
- state not reflected in arrow functions?
- Setting Multiple value from array using hooks
- How to wait for React context to load before loading page in Next.js
- Which Life cycle method should be preferred when using redux?
- Common js modules in react native
- How to set target in typescript to fromEvent() in rxjs
- using google fonts in nextjs with sass, css and semantic ui react
- pass coordinates from googlemaps react child to parent in functional component typescript
- React 0.13.1 rendering issue
- How to pass number of options to disable in react-select?
- Testing a login component with Jest
- Check screen size change for a specific width
- Most "react" way to have multiple different renderings
- React Router Switch and exact path
- How to handle form state with Formik and Redux-Saga
- How to align drawer items at bottom in drawer navigation?
- Why is my Redirect not working after the verifications?
- Redirect Router with React after an HandleSubmit
- Error in setState while trying to update bookings
- React span space in between text
- Need to add quantity on my react state object
- SCSS files not compiling to CSS in react using Webpack
- Style buttons with different palette colors
- Redux Filtering Array
- In React Context, how can I use state variables in state functions?
- Potree/Three.js - Where can I find the real time camera (active camera) position coordinates?
- Match every word, including non-a-z digits
- Mutliple components rendered in React JS using Router
- How can I close a Material UI Modal using an X icon rather than just by clicking outside the modal?