How to make AsNavFor work with the nearest slider in slick slider, but not all?

Question

JavaScript

Good evening!
Subject: dev.boichenko.space/remont
Scroll to the very bottom, there is a section "completed work" and each work has a slider. Implemented using two slick sliders, interdependent of each other:

$('.portfolio-slider-big').slick({
    arrows: false, 
    asNavFor: '.portfolio-slider-little'
  });
  $('.portfolio-slider-little').slick({
    prevArrow: "<span class='slick-prev'><i class='fas fa-angle-left'></i></span>", 
    nextArrow: "<span class='slick-next'><i class='fas fa-angle-right'></i></span>",
    asNavFor: '.portfolio-slider-big', 
    slidesToShow: 3, 
    focusOnSelect: true
  });

But the bottom line is that in two projects the sliders have the same classes, and if I twist the pictures in the first one, then the pictures in the second one are spinning. Is there a way to make sure that only the right one spins?
Tried like this:

asNavFor: $(this).parent().find('.portfolio-slider-big', )

But it doesn't work. Can someone implement similar with multiple sliders?
Thank you!

Answer 1

Came to the solution in another project. If you have several identical sliders, you just need to call them through each(), and then respectively access the desired elements through $(this), something like this:

$('.portfolio-slider-big').each(function(){
  $(this).slick({
    asNavFor: $(this).parents('.postfolio-slider-container').find('.portfolio-slider-little');
  });
});

Answer 2

api.jquery.com/eq-selector

asNavFor: '.portfolio-slider-little:eq(0)'
asNavFor: '.portfolio-slider-big:eq(0)'