在React中循环数组，并在迭代之间暂停

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

const LoopArray = () => {
  const [data, setData] = useState(['item1', 'item2', 'item3']);
  const [currentIndex, setCurrentIndex] = useState(0);

  useEffect(() => {
    const timer = setTimeout(() => {
      if (currentIndex < data.length - 1) {
        setCurrentIndex(currentIndex + 1);
      }
    }, 1000);

    return () => clearTimeout(timer);
  }, [currentIndex]);

  return (
    <div>
      {data[currentIndex]}
    </div>
  );
};

export default LoopArray;