Реагировать на изменение класса тела до установки компонента

У меня есть компонент входа в систему, который при установке должен быть таким, как показано ниже.

<body class="login-page">

Я устанавливаю имя класса с помощью хука useEffect, как показано ниже:

useEffect(
    () => {
        document.body.className = "login-page";
    },
    [],
    () => {
        document.body.className = "";
    }
);

После того, как пользователь успешно вошел в систему, он перенаправляется в компонент панели мониторинга. Перед монтированием компонента приборной панели необходимо удалить указанный выше класс тела. Вышеупомянутый useEffect делает это, но пользователь должен сначала обновить страницу, чтобы увидеть правильный макет компонента панели мониторинга.

Как лучше всего удалить класс тела после того, как пользователь вошел в систему, чтобы это не повлияло на компоновку компонента приборной панели?


reactjs react-router react-component react-component-unmount
person Edgias    schedule 13.11.2020    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Похоже, у вас проблема с крючком useEffect. Очистку нужно вернуть из useEffect вот так. Может быть, это решит вашу проблему? Это должно установить className тела, когда компонент монтируется, а затем удалить его, когда компонент размонтируется.

useEffect(() => {
  document.body.className = "login-page";
  
  return () => {
    document.body.className = "";
  }
}, []);

Изменить: если это не решит вашу проблему, вам следует дважды проверить, действительно ли компонент размонтируется.

person Thejool    schedule 13.11.2020