import React, { useRef, useState } from "react"; type num = { slides: any[]; }; export function MySlide({ slides }: num) { const firstLeftClick = useRef(true); const firstRightClick = useRef(true); const [page, setPage] = useState(1); const [slide, setSlide] = useState(1); // const slide = useRef(1); const [style, setStyle] = useState(""); const leftClick = () => { if (firstLeftClick.current) { firstLeftClick.current = false; firstRightClick.current = true; } else { setPage(page - 1); } // slide.current -= 1; setSlide(slide - 1); setStyle("-translate-x-full animate-slidetoright"); }; const rightClick = () => { if (firstRightClick.current) { firstLeftClick.current = true; firstRightClick.current = false; } else { setPage(page + 1); } // slide.current += 1; setSlide(slide + 1); setStyle("animate-slidetoleft"); }; return (
{slides.slice(page - 1, page + 2).map((slide) => (
{slide}
))}
); }