Data not populated at mount about use-http HOT 5 OPEN

@maximelebastard I figured out, It is because of React 18's strict mode. If you turn off, it will be fine or you can rollback to React 17 until this is handled by use-http package. Some other packages also faced this.

from use-http.

+1

@maximelebastard Did you figure out anything?

from use-http.

@MuzafferDede Nope sorry, I ended up switching to axios-hooks
https://www.npmjs.com/package/axios-hooks

from use-http.

It is happening due to abort on unmount feature useEffect(() => request.abort, []) at

If I remove this line it is working, but it is making duplicate get requests as component mounts, unmounts and remounts again in React 18 StrictMode.

Now I'm trying to solve this problem with abort the requests on unmount and making it work in React StrictMode.

Please let me know if you have any inputs

@alex-cory

from use-http.

I suppose this is the same issue that I see here.

An extract from my functional component:

    const [date, setDate] = useState(formatDate(nextDate(0), 'yyyy-MM-dd'))  // next Sunday
    const [jsonData, setJsonData] = useState({});

    // initializing Http API for fetching data from database
    const {loading, error, data} = useFetch(
        `https://${window.location.hostname}${proxy}/query?date=${date}`, 
        {responseType: 'json'}, 
        [date]
    );
    useEffect(() => {
        if (data) {
            setJsonData(data)
        }
    }, [data])

So I want to execute the effect when data becomes available. UseFetch is run when the component mounts, I can see the response coming back in the console, but the effect is not running. When I do setDate(), useFetch runs again on the new url, and then the effect is executed correctly!

Best regards,
Vic

from use-http.