antdesignpro实现滚动加载分页数据

原理解析：每滚动一次相当于翻页，请求后端时给的页码参数要想办法加1，后端才能根据页码给出相应数据

注意后端收到页码参数之后要准确计算出每页的首行数据，关键逻辑代码：

# 根据前端传的页码，进行计算下一页的起始行号
page = (int(params['page'])-1)*10+1
sql = f"SELECT * FROM dong_c_di_comment limit 10 offset {page}"
print(sql)

前端实现部分：

const [loading, setLoading] = useState(false);
const [data, setData] = useState([]);
// 定义传给后端的页码钩子
const [page, setPage] = useState(1);

const loadMoreData = async () => {
  if (loading) {
    return;
  }
  setLoading(true);
  const params = {page:page}
  get_cars(params)
    .then(res => {
      setData([...data, ...res.data]);
      setPage(page + 1);
      setLoading(false);
    })
    .catch(() => {
      setLoading(false);
    });
};

useEffect(() => {
  loadMoreData();
}, []);

return(
  

    }
      endMessage={加载完毕, 没有更多数据了哦 }
      scrollableTarget="scrollableDiv"
    >
       {
          // console.log("item1111111",item)
          return (
            
              }
                title={{item.title}}
                description={item.content}
              />
            
          )
        }
      }
      />
    
  
)