How to refresh the data in the InfiniteScroll component when I delete an item  #372

Activity

1. iamdarshshah commented on Apr 12, 2026

   

   iamdarshshah

   on Apr 12, 2026

   Collaborator

   More actions

   InfiniteScroll is a scroll container, it does not manage your data. It renders whatever children you pass in. When you delete an item, update your data array in state and re-render the list, the component will reflect the change automatically.

   const [items, setItems] = useState(initialItems);
   
   const handleDelete = (id) => {
     setItems(prev => prev.filter(item => item.id !== id));
   };
   
   <InfiniteScroll dataLength={items.length} ...>
     {items.map(item => <Item key={item.id} onDelete={handleDelete} />)}
   </InfiniteScroll>

   No API re-fetch needed, just update your local state. Does that help? Happy to answer follow-up questions.