reactjs - 带有 React useState 和 UseEffect 的自动滑块

Question

如何在不使用左右箭头的情况下使我的轮播自动滑动。左右方法已经开始工作了。

这是我到目前为止的代码：

function Slider() {
  let Arry = [
    <img src="\img\slide1.jpg" />,
    <img src="\img\slide2.jpg" />,
    <img src="\img\slide3.jpg" />
  ];
  const [x, setX] = useState(0);
  useEffect(() => {
    setX === 0 ? -100 * Arry.lenght-- : Arry.lenght++;
    setTimeout(x, 2000);
  });
  const goLeft = () => {
    x === 0 ? setX(-100 * (Arry.length - 1)) : setX(x + 100);
    console.log(x);
  };
  const goRight = () => {
    x === -100 * (Arry.length - 1) ? setX(0) : setX(x - 100);
    console.log(x);
  };
}

Answer 1

您可以在安装效果中使用 setInterval 并更改该功能中的状态。