window.parent.postMessage в @Listener

Question

У нас есть требование, чтобы мы загружали отдельную страницу как модальную (да, верно?)

Встроенная страница использует window.parent.postMessage(messageString, '*') сигнализировать действия были завершены.

Я хочу использовать stenciljs @Listener

У меня есть рабочий модал с iframe на другую страницу, используя старую школу window.addEventListener('message', myMessageHandlingDelegate),

Тем не менее, я действительно хотел бы использовать @Listener атрибут / декоратор для обработки результата опубликованного сообщения. Я старался @Listener('message') но код не был добавлен....

есть ли способ заставить слушателя stenciljs ловить сообщения, отправленные с дочерних IFrames?

Answer 1

@Listen Декоратор используется для добавления прослушивателя в пользовательские события JavaScript ( https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent) или в события, генерируемые дочерним компонентом Stencil. Это означает, что вы не можете использовать Message API (используя window.postMessage или прослушивание сообщения) с этим декоратором. Вы все еще можете использовать addEventListener на сообщение о событии, как вы указали в вопросе.

Answer 2

Я использовал следующий код в пользовательском компоненте stenciljs, чтобы заставить его работать:

@Listen('message', { target: 'window' })
handleMessage(ec) {
  console.log("Event from iFrame triggered");
}