需要在滑块导航中更改背景颜色

Question

function handleGesure() {
  let index = 0;
  const navs = document.querySelectorAll("[data-slide-to]");
  if (touchendX < touchstartX) {
    if (offset == +width.slice(0, width.length - 2) * (slides.length - 1)) {
      offset = 0;
    } else {
      offset += +width.slice(0, width.length - 2);
    }
    if (index < slides.length) {
      index++;
    }

    navs[index].style.backgroundColor = "#2192BF";

    navs.forEach(dot => (dot.style.backgroundColor = "#c4c4c4"));
    slidesField.style.transform = `translateX(-${offset}px)`;
  }
  if (touchendX > touchstartX) {
    if (offset == 0) {
      offset = +width.slice(0, width.length - 2) * (slides.length - 1);
    } else {
      offset -= +width.slice(0, width.length - 2);
    }
    if (index >= slides.length) {
      index--;
    }

    navs.forEach(dot => (dot.style.backgroundColor = "#c4c4c4"));
    navs[index].style.backgroundColor = "#2192BF";
    slidesField.style.transform = `translateX(-${offset}px)`;
  }
}

这是我的代码，需要在向左和向右滑动滑块时为导航（页面中的点）放置和更改背景颜色。