Как сделать так, чтоб swiper не видел элементы переключения соседнего свайпера?

Question

[oelena]

Есть шаблон html кода и по нему на странице реализуется много свайперов. Подключение сделано для всех слайдеров через data атрибут.
Вот кусочек кода

if ($(this).data('need-thumbs') === 1) {
				var param = {
					slidesPerView: 1,
					freeMode: false,
					navigation: {
						nextEl: '.next',
						prevEl: '.prev',
					},
				}
				swiperArray.push($(this)[0]);
				swiperArrayParam.push(param);
				return;
			}

			if ($(this).data('thumbs') === 1) {
				var param = {
					slidesPerView: 4,
					spaceBetween: 10,
					freeMode: true,
					watchSlidesVisibility: true,
					watchSlidesProgress: true,
				}
				var thumbs = new Swiper($(this)[0], param);
				var paramN = swiperArrayParam[swiperArray.length - 1];
				paramN.thumbs = {
					swiper: thumbs
				};
				new Swiper(swiperArray[swiperArray.length - 1], paramN);
				return;
			}

В этом варианте при клике на маленькие карточки, кликается только нужный свайпер, а вот стрелки двигают все слайды на странице. Как сделать так, чтоб имея один и тот же класс у кнопок переключения каждый свайпер видел только свои кнопки?