Почему обнуляется переменная

Столкнулась со следующей проблемой при написании слайдера в реакте. Есть код:

const slider = useRef(null);
  let position = 0;
  const [prev, setPrev] = useState(true);
  const [next, setNext] = useState(false);

  const goPrev = () => {
    console.log(`position ${position}`);
    if (position === 0) {
      setPrev(true);
    } else {
      console.log(`position ${position}`);
      position += 1200;
      console.log(`position ${position}`);
      setNext(false);
      if (position === 0) {
        setPrev(true);
      }
      slider.current.childNodes.forEach((element) => {
        element.style = `transform: translateX(${position}px)`;
      });
    }
  };

  const goNext = () => {
    if (position >= -(items.length * 300) + 1500) {
      position -= 1200;
      if (position <= -(items.length - 4) * 300) {
        setNext(true);
      }
      setPrev(false);
      console.log(`position ${position}`);
      slider.current.childNodes.forEach((element) => {
        element.style = `transform: translateX(${position}px)`;
      });
    } else {
      setNext(true);
      console.log(`position ${position}`);
    }
  };

При конечном значении -3600 и нажатии на кнопку goPrev значение position становится 0 и обе кнопки оказываются заблокированы. Консоль и заблокированные кнопки


Ответы (0 шт):