Блог

В моем приложении React Native у меня есть бесконечная прокрутка (плоский список), и мне нужно иметь возможность искать определенные элементы. Теперь проблема, с которой я столкнулся, заключается в том, что у меня есть событие onEndReached, которое загружает больше данных, которые выглядят следующим образом:

 onEndReached={() => {
    props.fetchOrders('', offset, 10);
    setOffset(offset   10);
}}
  

Происходит вызов API, и мое состояние Redux обновляется вместе с заказами, а затем заказы добавляются в мой FlatList с помощью перехвата useEffect, который зависит от элементов в состоянии Redux:

 useEffect(() => {
  if (props.orders.length > 0) {
    setIsLoading(false);
    
    setOrders([...orders, ...props.orders])

  } else {
    setIsLoading(true);
  }
}, [props.orders])
  

Теперь в компоненте заголовка FlatList должна быть панель поиска, где я могу искать определенные элементы, которые запускают вызов API, который затем обновляет состояние Redux, которое затем запускает мой хук useEffect и обновляет элементы в FlatList. Проблема в том, что с моим текущим подключением useEffect мои элементы просто добавляются к моему списку, а не перезаписываются. Есть ли чистое решение о том, как это реализовать, или мой метод useEffect просто не подходит для моих нужд?