Как установить активный слайд по умолчанию в Swiper JS

#javascript #jquery #swiperjs #swiper.js

Вопрос:

У меня есть HTML

 <div class="swiper-container instance-0" data-id="nav-slider">
  <ul class="swiper-wrapper nav-content__list">
    <li class=" swiper-slide nav-content__item">
      <a class=" link link--ms" href="/news-stories/stories">
        <span class="link__text">
         Stories
        </span>
      </a>
    </li>
    <li class=" swiper-slide nav-content__item">
      <a class=" link link--ms" href="/news-stories/multimedia">
        <span class="link__text">
          Multimedia
        </span>
      </a>
    </li>
    <li class=" swiper-slide nav-content__item">
      <a class=" link link--ms" href="/news-stories/press-releases">
        <span class="link__text">
          Press releases
        </span>
      </a>
    </li>
  </ul>
</div>
 

Мой js:

 const $navSlider = $('[data-id="nav-slider"]');
      const $swiperInstances = [];
      const $currentPath = window.location.pathname;
      $navSlider.each(function (index, sliderElement) {
        const $this = $(this);
        $this.addClass(`instance-${index}`);
        $swiperInstances[index] = new Swiper(sliderElement, {
          slidesPerView: 'auto',
          watchOverflow: true,
          initialSlide: '2',
        });
      });
 

Но initialSlide не работает для меня.
$swiperInstances[индекс].slideTo(2) тоже не работает

Мне нужно установить элемент по умолчанию в swiperslider

Комментарии:

1. Попробуйте установить data-id=»nav-слайдер» в элемент ul

2. если я введу пользовательское имя класса, оно будет работать, но первый элемент останется по умолчанию