Undefined output in console.log(err.message)

Issue

useEffect(function () {
    async function fetchData() {
      try {
        setIsLoading(true);
        const res = await fetch(
          `http://www.omdbapi.com/?apikey=${apiKeyOmdb}&s=${query}`
        );
        const data = await res.json();
        console.log("data", data);

        if (data.Response === "False") {
          console.log("False");
          throw new Error("test1");
        }

        setMovies(data.Search);
      } catch (err) {
        console.log(err.message);
        setError(err);
      } finally {
        setIsLoading(false);
      }
    }
    fetchData();
  }, []);

Hello everyone Please help me with the problem: when output to console.log(err.message), undefined is output, although I throw the error throw new Error("test1");

Solution

You have a component named Error which is conflicting with the browsers' Error. throw new Error is throwing your Component, not an error object.

Either rename your component or change the throw statement to throw new window.Error('test1');.

Answered By - knittl