sernato
@sernato
Python Junior Developer

Как сохранять состояние открыта ли или закрыта боковая панель с помощью localstorage?

Это мой первый опыт в использовании localstorage и я хочу сохранять состояние через хуки.
Нужно запоминать показана либо скрыта боковая панель фильтра. Пока что в коде все топорно просто и при обновлении страницы данные возвращаются на исходную позицию. Пожалуйста, сориентируйте в этом вопросе.
const TaskRegionView = () => {
    const [condition, setCondition] = useState(true);

    const handleToggleCondition = () => {
        setCondition(prev => !prev);
    };
....
<Button onClick={handleToggleCondition} className={styles['button']}>
                    <LeftOutlined />
                </Button>
                {condition && (
                    <>
                        <Button onClick={handleToggleCondition} className={styles['button-open']}>
                            <RightOutlined />
                        </Button>
                        <Filter
                            className={styles['filter']}
                        />
                    </>
                )}
  • Вопрос задан
  • 48 просмотров
Пригласить эксперта
Ответы на вопрос 2
IwanQ
@IwanQ
Плохие времена часто дают прекрасные возможности
Не тестил, но должно воркать

const TaskRegionView = () => {
    const isMenuOpenLocalStorageKey = '__isMenuOpen';
  
    const [condition, setCondition] = useState(() => {
      const value = localStorage.getItem(isMenuOpenLocalStorageKey);

     const isOpen = JSON.parse(value);
      
      if (isOpen === null) return false;
      
      return value;
    });

    const handleToggleCondition = () => {
        setCondition((prev) => {
          const state = !prev;
          
          localStorage.setItem(isMenuOpenLocalStorageKey, JSON.stringify(state));
          
          return state;
        });
    };
...
Ответ написан
Комментировать
Seasle
@Seasle Куратор тега React
Ответ написан
Комментировать
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы
29 мар. 2024, в 10:00
10000 руб./за проект
29 мар. 2024, в 09:59
750 руб./в час
29 мар. 2024, в 09:55
50000 руб./за проект