use-http
use-http copied to clipboard
Fetching multiple URLs at once
How can you use use-http
to fetch multiple URLs at once with a single hook? Ideally there would be a way to pass in an array which described a list of fetches instead of being limited to a single fetch.
This is necessary to get around React Hooks's limitation of hooks being constant in render. For example, consider a component that receives a list of user IDs:
const UserList = ({ ids }) => {
const { data, loading, error } = useFetch(ids.map(id => `/user/${id}`), [ids])
if (loading) return <div>Loading…</div>
if (error) return <div>Error!</div>
return (
<div>
<h3>{data.length} Users</h3>
{data.map(user => <User key={user.id} user={user} />)}
</div>
)
}
I don't see a way to solve this currently with use-http
?
I saw https://github.com/ava/use-http/issues/83 but it didn't seem to be solved, it suggested a solution that seems pretty roundabout, whereas I think this is so core that it should be solved in the library itself.
hey u should use a POST and send an array of ids to your endpoint... your code looks bad in performance and maintenance