Реагировать js: установить фокус на кнопку, которая была ранее отключена - PullRequest
Новая
       36

Реагировать js: установить фокус на кнопку, которая была ранее отключена

0 голосов
/ 06 мая 2019

(вопрос в конце) У меня есть кнопка, которая открывает модальное событие onClick.Я хочу, чтобы кнопка была отключена, когда пользователь щелкает ее, и включалась обратно, когда модальное окно закрывается.Я сделал что-то похожее на это: (Это работает, как и ожидалось, здесь не проблема) Я установил состояние btnDisabled в false в конструкторе. 

<Button
    label='Mybutton'
    className={['btn-outline-primary']}
    onClick={this.loadModel}
    disabled={this.state.btnDisabled}
/>

OnClickСобытие кнопки выглядит следующим образом: 

loadModel(event) {
    this.setState({
      ModelOpen: true,
      btnDisabled: true,
    });
    this.activeElement = event.target;
  }

Функция, связанная с кнопкой закрытия (x) режима, выглядит следующим образом: 

closeModel() {
    this.setState({
      ModelOpen: false,
      btnDisabled: false,
    });
    this.activeElement.focus();
  }

Вопрос: проблема в том, что фокус не смещается на Mybutton .Когда я пытаюсь вывести document.activeElement.outerHTML в журнале консоли, он выводит кнопку закрытия.Из-за этого мои тесты не пройдены, так как ожидается MyButton, а не кнопка закрытия, связанная с модальным.

UPDATE Тесты работают нормально, если я удаляю логику кнопки отключения.Вот неверное утверждение: 

expect(wrapper.find('.btn-outline-primary').html()).toEqual(document.activeElement.outerHTML);

1 Ответ

0 голосов
/ 06 мая 2019

Вы добавляете eventListener к элементу Button.В javascript причина появления события может варьироваться.

попробуйте использовать event.currentTarget, чтобы получить экземпляр кнопки.Надеюсь это поможет.Будет лучше, если вы предоставите здесь фрагмент проблемы.

...