Search code examples
javascriptreactjsarraysvideouse-effect

React Hook useEffect received a function whose dependencies are unknown


function MoviePage(){

    const [movies, setMovies] = useState([]);
    const [searchValue, setsearchValue] = useEffect('');
  
        const getMovieRequest = async (searchValue) => {
            const url = `http://www.omdbapi.com/?s=${searchValue}&apikey=d03f9066`;
    
            const response = await fetch(url);
            const responseJson = await response.json();
    
            if (responseJson.Search){
                setMovies(responseJson.Search);
            }
    
        }; 
        useEffect(() => {
            getMovieRequest(searchValue);
    }, [searchValue]);

output

Search for the keywords to learn more about each warning.
To ignore, add // eslint-disable-next-line to the line before.

WARNING in [eslint] 
src\pages\Movie.js
  Line 11:43:  React Hook useEffect received a function whose dependencies are unknown. Pass an inline function instead  react-hooks/exhaustive-deps

webpack compiled with 1 warning

Solution

  • The error is thrown in

    const [searchValue, setsearchValue] = useEffect('');
    

    I think you wanted it to be:

    const [searchValue, setsearchValue] = useState('');