Javascript 滑动转盘计数器空值

我正在尝试为滑动转盘制作计数器，但在第一张幻灯片中它总是变为null，但在我移动到下一张幻灯片时它会工作，问题只在刷新页面时发生，第一个值变为1/null

<script>
        $('.regions-slider').slick({
            dots: false,
            infinite: true,
            speed: 300,
            slidesToShow: 1,
            arrows:true,
            prevArrow:'<button type="button" class="slide-btn slide-btn-prev"><i class="far fa-arrow-alt-circle-left"></i></button>',
            nextArrow:'<button type="button" class="slide-btn slide-btn-next"><i class="far fa-arrow-alt-circle-right"></i></button>',

});

var $slider = $('.regions-slider');

  var currentSlide;
  var slidesCount;
  var sliderCounter = document.createElement('div');
  sliderCounter.classList.add('slideCount');
  
  var updateSliderCounter = function(slick, currentIndex) {
    if(slick.slideCount == null){
        slidesCount = $slider.length;
    }
    currentSlide = slick.slickCurrentSlide() + 1;
    slidesCount = slick.slideCount;
    $(sliderCounter).text(currentSlide + '/' + slidesCount);

  };

  $slider.on('init', function(event, slick) {
    $slider.append(sliderCounter);
    updateSliderCounter(slick);
  });

  $slider.on('afterChange', function(event, slick, currentSlide) {
    updateSliderCounter(slick, currentSlide);
  });

  $slider.slick();

    </script>

$（'.regions滑块'）.slick({
点：错，
无限：是的，
速度:300,，
幻灯片放映：1，
箭头：是的，
前箭头：“”，
下一行：''，
});
变量$slider=$（'.regions slider'）；
无功电流；
var滑动计数；
var sliderCounter=document.createElement（'div'）；
slidecounter.classList.add（'slideCount'）；
var updateSliderCounter=函数（slick，currentIndex）{
if（slick.slideCount==null）{
SlideCount=$slider.length；
}
currentSlide=slick.slickCurrentSlide（）+1；
slideCount=slick.slideCount；
$（幻灯片计数）.text（当前幻灯片+'/'+幻灯片计数）；
};
$slider.on（'init'，函数（事件，滑动）{
$slider.append（sliderCounter）；
更新滑动计数器（光滑）；
});
$slider.on（'afterChange'，函数（事件、滑动、当前滑动）{
更新滑动计数器（滑动，当前滑动）；
});
$slider.slick（）；

---

我在中文网站及其工作原理中找到了这个答案：

  $('.regions-slider').on('init', function(event, slick) {
    $(this).append('<div class="slideCount"><span class="current"></span> / <span class="total"></span></div>');
    $('.current').text(slick.currentSlide + 1);
    $('.total').text(slick.slideCount);
  })
  .slick({
    dots: false,
            infinite: true,
            speed: 300,
            slidesToShow: 1,
            arrows:true,
            prevArrow:'<button type="button" class="slide-btn slide-btn-prev"><i class="far fa-arrow-alt-circle-left"></i></button>',
            nextArrow:'<button type="button" class="slide-btn slide-btn-next"><i class="far fa-arrow-alt-circle-right"></i></button>',
  })
  .on('beforeChange', function(event, slick, currentSlide, nextSlide) {
    $('.current').text(nextSlide + 1);
  });

$（'.regions slider'）。在（'init'，函数上（事件，滑动）{
$（this.append（'/'）；
$（'.current'）.text（slick.currentSlide+1）；
$（'.total'）.text（slick.slideCount）；
})
.滑头({
点：错，
无限：是的，
速度:300,，
幻灯片放映：1，
箭头：是的，
前箭头：“”，
下一行：''，
})
.on（'beforeChange'，函数（事件、滑动、当前滑动、下一滑动）{
$（'.current'）.text（nextSlide+1）；
});