Реагируйте на URL маршрута и просматривайте изменения, но функция компонента все еще активна. Зачем?

Question

У меня есть функция события, которая вызывается нажатием кнопки. Его цель - удерживать фиксированное положение тела, не допуская прокрутки, пока вы не нажмете кнопку еще раз, чтобы закрыть / выключить его.

Он работает нормально, но когда я нажимаю на другую страницу, не выключая ее, она все еще активна. Это означает, что новая страница не будет прокручиваться, потому что положение тела фиксировано.

Я новичок в React FYI

Мой код:

bodyFixed(event) {
  document.body.classList.add('body-fixed');
}

bodyRelative(e) {
  document.body.classList.remove('body-fixed');
}

Я использую реагирующий статический withRouteData, RouteData, Router и у меня нет проблем на этих страницах. Но на страницах, таких как страница статьи, где маршрут не меняется таким же образом. Вот где я вижу проблему.

Есть что-то, с чем я могу обернуть это так, чтобы, когда я щелкаю к ​​новой странице, это возвращается к умолчанию?

Пожалуйста, сначала спросите, если вам нужно больше информации, и я с удовольствием добавлю больше.

Answer 1

Да, вы можете позвонить bodyRelative метод в componentWillUnmount Крюк жизненного цикла для сброса класса. Что-то в этом роде:

  componentWillUnmount() {
    this.bodyRelative()
  }