loki-usefetch
v1.0.5
Published
easy api call react hook
Downloads
9
Maintainers
Readme
Example
import React from 'react';
import { useFetch } from 'loki-usefetch';
const TestComponent = () => {
const [currentPage, setCurrentPage] = useState(1);
// Use the useFetch hook with the API URL and current page
const { data, isLoading, isError, refetch } = useFetch<DataItem>(
'https://example-api.com/data',
currentPage
);
// Define the type/interface representing your data item
interface DataItem {
id: number;
name: string;
// Add other properties as needed
}
if (isLoading) {
return <div>Loading...</div>;
}
if (isError) {
return (
<div>
<div>Error: {isError}</div>
<button onClick={() => refetch(currentPage)}>Retry</button>
</div>
);
}
return (
<div>
{data && data.map((item) => <div key={item.id}>{item.name}</div>)}
<button onClick={() => setCurrentPage((prevPage) => prevPage + 1)}>Next Page</button>
<button onClick={() => refetch(currentPage)}>Refresh Data</button>
</div>
);
};
export default TestComponent;