在react函数组件中怎么用antd中的分页

要在React函数组件中使用Ant Design的分页组件，你需要先安装Ant Design库，然后在你的组件中导入分页组件并使用。以下是一个简单的示例代码：

import React, { useState, useEffect } from 'react';
import { Pagination } from 'antd';

function MyComponent() {
  const [currentPage, setCurrentPage] = useState(1);
  const [totalPages, setTotalPages] = useState(0);

  useEffect(() => {
    // 这里可以调用接口获取数据并计算总页数
    setTotalPages(10);
  }, []);

  function handlePageChange(page) {
    // 处理分页变化事件
    setCurrentPage(page);
  }

  return (
    <div>
      {/* 在页面中渲染分页组件 */}
      <Pagination current={currentPage} total={totalPages} onChange={handlePageChange} />
    </div>
  );
}

export default MyComponent;

在上面的代码中，我们使用了useState和useEffect Hook来管理当前页数和总页数。在useEffect中，我们可以调用接口获取数据并计算总页数，这里简单地设置为10。在渲染时，我们使用Pagination组件来呈现分页组件，并将当前页数、总页数和分页变化事件函数传递给它。当用户点击分页组件时，handlePageChange函数将被调用，用来更新当前页数并重新渲染页面。