useEffect 分页

在 React 中，`useEffect` 是一个用于处理副作用的 Hook。它可以在函数组件中执行一些异步操作、订阅事件、处理定时器等。

关于分页，你可以使用 `useEffect` 来监听分页的变化，并在分页改变时触发相应的操作。下面是一个简单的示例：

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

const YourComponent = () => {
  const [currentPage, setCurrentPage = useState(1);

  useEffect(() => {
    // 在这里执行分页相关的操作，比如从后端获取数据等
    fetchData();
  }, [currentPage]);  // 当 currentPage 发生变化时触发

  const fetchData = async () => {
    // 使用 currentPage 去获取相应页码的数据
    // 这里可以发起异步请求，比如使用 axios、fetch 等
    const response = await axios.get(`/api/data?page=${currentPage}`);
    const data = response.data;
    // 处理获取到的数据
    // ...
  };

  const handlePageChange = (page) => {
    setCurrentPage(page);
  };

  return (
    <div>
      {/* 显示当前页的内容 */}
      {/* ... */}

      {/* 分页组件或按钮，用来切换页面 */}
      {/* ... */}
    </div>
  );
};

export default YourComponent;

在上面的示例中，`currentPage` 是存储当前页码的状态。当 `currentPage` 发生变化时，`useEffect` 将会执行 `fetchData` 函数，去获取相应页码的数据。你可以根据实际需求来修改 `fetchData` 函数，比如使用 axios 或其他库来发起异步请求。

同时，你可以根据具体的 UI 库或组件库，使用相应的分页组件或按钮来实现页面切换的功能。在示例代码中，我简单地使用了注释来表示分页相关的内容。

希望这个例子可以帮到你理解如何在 React 中使用 `useEffect` 处理分页。如果有任何疑问，请随时提问！