Каков правильный порядок включения lit-элементов в мой скрипт? - PullRequest
Новая
       12

Каков правильный порядок включения lit-элементов в мой скрипт?

0 голосов
/ 05 февраля 2019

Допустим, у меня есть этот HTML: 

<outer-element>
  <inner-element></inner-element>
</outer-element>

inner-element и outer-element - это пользовательские элементы, расширенные от LitElement.

Существует ли предписанный порядок включения файлов, определяющих этиэлементы в моем сценарии?

Например
A. 

import './inner-element.js';
import './outer-element.js';

против
B. 

import './outer-element.js';
import './inner-element.js';

Я заметил, что порядок включенияопределяет порядок отображения элементов.То есть А приводит к тому, что render() вызывается во внутреннем, а затем во внешнем.В то время как B приводит к вызову render() на внешнем, а затем на внутреннем.

Живой пример, где вы можете переключить порядок и увидеть результат в консоли, предоставленный здесь .

Моя (наивная) интуиция заключалась в том, что порядок визуализации будет определяться структурой HTML-страницы.Вместо этого, кажется, определяется порядок включения Javascript.Что заставляет меня хотеть знать: является ли заказ правильным?

1 Ответ

0 голосов
/ 05 февраля 2019

С точки зрения HTML-парсера порядок, рассматриваемый как правильный , должен быть порядком появления элементов (вашей интуиции).

Но из выполнение Javascript точка зрения ... это зависит от намерений автора и разработчика.

Как правило, если вы не являетесь одновременно автором и пользователем пользовательского элемента, вы не можете знать, является лиПользовательский элемент определяется до или после его анализа, а также порядок, в котором определены 2 различных элемента.

Поэтому, как автор веб-компонентов, вы должны попытаться разработать пользовательские элементы, рендеринг которых не зависит от определения.порядок (насколько это возможно).В противном случае разъясните это в документации.

Как потребитель / пользователь веб-компонентов, вы должны знать (и вам известно) о побочных эффектах асинхронной загрузки и отложенного определения сценариев и модулей.

...