React挂钩FlatList分页

import React, { useState, useEffect } from 'react';
import { FlatList, View, Text } from 'react-native';

const YourComponent = () => {
  const [dataSource, setDataSource] = useState([]);
  const [currentPage, setCurrentPage] = useState(1);
  const pageSize = 10; // 每页数据数量

  useEffect(() => {
    // 在此处进行网络请求或其他方式获取初始数据
    // 将数据存储在dataSource中
    // 可以使用第三方库如axios或fetch进行网络请求
    fetchData();
  }, []);

  const fetchData = () => {
    // 根据当前页码和每页数据数量获取数据
    // 将数据添加到dataSource中
    // 例如：
    // const newData = await fetch('http://example.com/data?page=' + currentPage + '&pageSize=' + pageSize);
    // setDataSource([...dataSource, ...newData]);
  };

  const loadMoreData = () => {
    setCurrentPage(currentPage + 1);
    fetchData();
  };

  const renderItem = ({ item }) => (
    <View>
      <Text>{item.title}</Text>
    </View>
  );

  return (
    <FlatList
      data={dataSource}
      keyExtractor={(item, index) => index.toString()}
      renderItem={renderItem}
      onEndReached={loadMoreData}
      onEndReachedThreshold={0.1}
    />
  );
};

export default YourComponent;