React Native - как визуализировать динамический список с помощью карты

У меня есть список элементов, которые я хочу визуализировать. Когда пользователь доходит до конца списка, он загружает больше элементов. Проблема в том, что страница является ScrollView, поэтому я не могу использовать FlatList для ее визуализации (вы не можете использовать ScrollView внутри ScrollView). Сейчас я использую для этого карту.

ItemsList.js:

export const ItemsList = (props) => {
    const { type, isEndReached } = props;
    const [items, setItems] = useState([]);
    const [page, setPage] = useState(1);

    useEffect(() => {
        if (!items.length || page > 1) {
           getItemsList(type);
        }
    }, [page, type]);

    useEffect(() => {
        if (isEndReached && isLoadMore) {
            setPage(page + 1);
        }
    }, [isEndReached]);

    const getItemsList = async (type) => {
        const loadedItems = await ItemService.getItems(page, type);
        setItems(_.concat(items, loadedItems));
    };

    const renderItem = (item, idx) => {
        return (
            <Item
                key={item.id}
            />
        )
    }

    const RenderList = () => {
        return items.length ? items.map((item, idx) => renderItem(item, idx)) : null;
    };

    render (
        <View>
            <RenderList/>
        </View>
    )
}

Компонент ItemsList находится внутри страницы ScrollView.

Когда я загружаю больше результатов, я объединяю массив элементов из состояния с новым массивом с сервера и устанавливаю новый массив как список элементов. Это заставит снова отобразить весь список (даже если у каждого элемента другой идентификатор).

Как сделать список, чтобы отображались только дополнительные элементы, а не весь список?

Спасибо!