CriticalError
@CriticalError
Самоучка

Как остановить setInterval в react при переходе между страниц с использованием NavLink?

Приложение react, на странице работает функция setInterval.
import React from "react";
import logo from "./logo/logo.svg";
import style from "./StartPage.module.css";
import Cell from "./Cell";
import { NavLink } from "react-router-dom";

export const change = (arr) => {
  let i = -1;
  setInterval(function () {
    document.querySelector("i").className =
      arr[(i = ++i == arr.length ? 0 : i)];
  }, 1000);
};

const StartPage = () => {
  const arrD = [style.indicator, style.indicatorleft];
  change(arrD);
  return (
    <div className={style.grid}>
      <img src={logo} alt="bugaga"></img>

      <div className={style.radiobutton}>
        <NavLink
          onClick={() => {
            clearInterval(change);
          }}
          to="/radio">
          RadioButton
        </NavLink>
        <div className={style.list}>
          <div className={style.cell}>
            <div className={style.togle}>
              <i className={style.indicatorleft}></i>
            </div>
          </div>
          <Cell />
          <Cell />
          <Cell />
          <Cell />
          <Cell />
          <Cell />
          <Cell />
          <Cell />
        </div>
      </div>
      <div className={style.radio}>
        <NavLink to="/button">Button</NavLink>
        <div className={style.list}></div>
      </div>
    </div>
  );
};

export default StartPage;


Но при переходе на другую страницу через NavLink

<div className={style.radiobutton}>
        <NavLink
          onClick={() => {
            clearInterval(change);
          }}
          to="/radio">
          RadioButton
        </NavLink>


Выдает ошибку.60a9fa75dc14d473987541.png
Подскажите как ее исправить или другой правильный способ остановки setInterval при срабатывании NavLink.
Если нужен код других компонент, напишите
  • Вопрос задан
  • 30 просмотров
Пригласить эксперта
Ответы на вопрос 1
@Kentavr16
document.querySelector("i").className =
      arr[(i = ++i == arr.length ? 0 : i)];


ошибка возникает потому что вы пытаетесь задать идентификатор className как массив.
правильная запись - className = "myClass" или что-то подобное. Что вы хотели бы сделать с помощью этого кода? просто отключить таймер?
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы