reactjs - 将活动幻灯片设置为 swiper/react 与反应状态

Question

我想问一下是否有办法用 swiper/react 控制/设置活动幻灯片？

我尝试使用道具处理 onSwiper 函数，但仍然无法更新幻灯片索引。

谢谢

标签： reactjsswiper

Answer 1

您可以使用 swiper 实例访问 swiper API ( https://swiperjs.com/api/ ) 并且有方法slideTo。

所以在代码示例中它看起来像这样

const App = () => {
  // store swiper instance
  const [swiper, setSwiper] = useState(null);

  const slideTo = (index) => swiper.slideTo(index);

  return (
      <Swiper onSwiper={setSwiper} >
        {/* ... */}
      </Swiper>
  )
}