0

I am trying to fetch some data from a FastAPI backend using the following:

const [data, setData] = useState()

const fetchData = async () => {
        const res = await axios.post(`${fetchUrl}/fetch_data_calc`, {
            year: year,
            month: month,
            day: day,
            hour: hour,
        });
        setData({
            data1: res.data.data1,
            data2: res.data.data2,
            data3: res.data.data3,
            data4: res.data.data4,
        });
        return res.data;
    };

    const { isError, refetch, isFetching } = useQuery({ queryKey: ["myData"], queryFn: fetchData, retry: false });

And this works. But in my attempt to make it a bit more readable I am doing this:

const { isError: isError, refetch: refetch, isFetching: isFetching } = useQuery(
        ["myData"],
        () => fetchData("fetch_data_calc", { year: year, month: month, day: day, hour: hour, }, setData),
        { retry: false }
    );

However, in doing so, I get errors such as:

Request failed with status code 422 Query data cannot be undefined. Please make sure to return a value other than undefined from your query function. Affected query key: ["myModel"]

And I am not sure what I am doing wrong here. Similar code in another component, which does something very similar works fine. But not in this case.

Denver Dang
  • 2,433
  • 3
  • 38
  • 68

0 Answers0