如何使用javascript数据文件在react中显示每页单个数据？

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

const DataDisplay = () => {
  const [data, setData] = useState([]);
  const [currentPage, setCurrentPage] = useState(1);
  const [itemsPerPage] = useState(1);

  useEffect(() => {
    fetch('/path/to/data.json')
      .then(response => response.json())
      .then(data => setData(data));
  }, []);

  const indexOfLastItem = currentPage * itemsPerPage;
  const indexOfFirstItem = indexOfLastItem - itemsPerPage;
  const currentItems = data.slice(indexOfFirstItem, indexOfLastItem);

  const paginate = pageNumber => setCurrentPage(pageNumber);

  return (
    <div>
      {currentItems.map(item => (
        <div key={item.id}>
          <h2>{item.name}</h2>
          <p>{item.description}</p>
        </div>
      ))}
      <button onClick={() => paginate(currentPage - 1)} disabled={currentPage === 1}>Previous</button>
      <button onClick={() => paginate(currentPage + 1)} disabled={indexOfLastItem >= data.length}>Next</button>
    </div>
  );
};

export default DataDisplay;