const [hasMore, setHasMore] = useState(true)
const [page, setpage] = useState(4)
const loadMore = async () => {
const { data } = await axios.get('http://localhost:3001/shoplist')
const dd = data.arr.splice(0, page)
setlist(dd)
if (page <= 19) {
setTimeout(() => {
setpage(page + 4)
}, 3000)
} else {
setHasMore(false)
}
}
<List>
{
list.map(item => {
return (
<div key={item._id}>
<p>{item.name}</p>
</div>
)
})
}
</List>
<InfiniteScroll loadMore={loadMore} hasMore={hasMore} />