Получение элемента по идентификатору в DOM - PullRequest
0 голосов
/ 11 октября 2018

Я создаю элемент , а затем хочу добавить к нему прослушиватель событий.Я делаю:

console.log('about to create modal');
this.createModal(
  'There are unsubmitted changes in this Access Request.',
  'Do you wish to discard them?',
  'Yes',
  'No',
  'tabCloseModal'
);
console.log('created modal');
const modal = this.shadowRoot.querySelector('#tabCloseModal');
console.log(`modal = ${modal}`);
modal.addEventListener('px-modal-accepted', function(e) {
  console.log('removing tab');
  this.removeTab(index);
});

Где createModal создает элемент:

  createModal(headerText, bodyText, acceptText, rejectText, id, opened = true) {
    const modal = document.createElement('px-modal');
    //assign parameters
    document.swQuerySelector('body').appendChild(modal);
    console.log('Child appended');
    modal.visible = true;
    this.fire('modal-visible');
  }

Неважно, что я делаю (Я устал swQuerySelector, swQuerySelectorAll, querySelector, querySelectorAll), я не могу понять модал.Когда я регистрирую его, он просто отображается как пустой, неопределенный или [объектный объект] или как-то в этом роде, и я никогда не получаю «удаление вкладки».Чего мне не хватает?Показывается модальный режим, но отображение принятого прослушивателя событий не работает.

1 Ответ

0 голосов
/ 11 октября 2018

Чтобы решить эту проблему:

  1. Верните модальное значение из createModal и подтвердите, что он работает, как ожидается в коде вызова.

  2. Если это так, проблема в вашей строке this.shadowRoot.querySelector.Установите точку останова в этой точке и попробуйте несколько путей к querySelector в devtools command line, пока не получите свой модал.Попробуйте найти модальное окно в вашем devtools elements, чтобы увидеть, где оно находится.Не видя макет вашей DOM, мы не можем предложить точный путь к родительскому элементу.

Shadow DOM может иногда становиться «теневым» ...

...