Не проверена ли внешняя проверка, когда элемент удален из DOM с помощью React Hooks - PullRequest
0 голосов
/ 16 апреля 2020

У меня есть div и кнопка в этом div, которая увеличивает счетчик шагов, а затем удаляется, когда счетчик шагов достигает 2

Когда я щелкаю за пределами div, я хочу, чтобы он не отображался в DOM.

У меня есть функция handleCLickOutside, например, так:

const handleClickOutside = (event) => {
        event.preventDefault()
        if (
            sessionDataRef.current && 
            !sessionDataRef.current.contains(event.target) && 
            !sessionDataTitleRef.current.contains(event.target)
        )
        {
            closeSessionView();
        }
    };

Функция closeSessionView передается из родительской функции, но она просто использует useState, чтобы установить состояние показа для div в false.

Моя кнопка условно показана примерно так:

  { sessionDataActiveStep < 2 && <div className="sessionCardNext" onClick={handleNextSessionData}>
            <ArrowButton/>
        </div>}

И handleNextSessionData просто увеличивает sessionDataActiveStep.

Когда sessionDataActiveStep === 2 это не удается. Удаление ArrowButton из DOM, кажется, заставляет его думать, что щелчок, который увеличивает sessionDataActiveStep до 2, каким-то образом все еще происходит. event.PreventDefault не помогает. Проверка, что sessionDataActiveStep <2 в handleClickOutside (), похоже, ничего не делает. </p>

Есть идеи?

...