How to set initial active slide to different index in swiperjs ReactJS?

Viewed 2458

I want to set the index of the swiper's active slide to the center position? As you can see in picture the active index is set to 0, I want it be number 3, i.e: middle and it should remain middle

 <Swiper
      grabCursor={true}
      spaceBetween={10}
      modules={[Navigation, Thumbs]}
      slidesPerView={7}
    //  activeSlideKey={3}
      slideActiveClass={styles.activeSlider}
    >
      {options.map((option) => () => <SwiperSlide key={option}>{option}</SwiperSlide>)}
    </Swiper>

activeSlideKey is just for reference. It does not work.

2 Answers
<Swiper
centeredSlides ={true}
>
...
</Swiper>
Related