React Slick 获取当前页码

Question

我查看了所有文档并设法使用下面的代码获取了幻灯片的数量。有很多关于获取总幻灯片的解决方案，但没有关于如何在使用多张幻灯片时获取当前页码的解决方案。本质上，它所在的点号。

我想用 currentPage / TotalPages 显示单独的导航箭头。即 1 / 4。我也有响应使得硬编码计算变得更加困难。

afterChange: (current) => setCurrentSlide(current + 1), - gives current slide number
customPaging: (i) => {
   setPageCounter(i + 1); - This gives me total number of pages
   return <a>{i}</a>;
}

拥有当前幻灯片意味着我当然得到例如 5 / 2。

或者，我发现 slick 可能会很慢，如果有人可以建议一个可以计算页数而不是幻灯片数量的替代方法。

Answer 1

好吧，看来只是把它写出来清除了一个思维障碍。

我使用了转到下一页或上一页/幻灯片后的状态。

const handlePrevSlide = () => {
    slider.current.slickPrev();
    currentPage > 1 && setCurrentPage(currentPage - 1);
};
const handleNextSlide = () => {
    slider.current.slickNext();
    currentPage < pageCounter && setCurrentPage(currentPage + 1);
};

仍然存在一些问题，因为它似乎一次向后滚动 1，而不是向前滚动相同的数量，但这解决了上面的直接问题。

React Slick 获取当前页码

React Slick get current page number

reactjs

react-slick