Обзор шаблонов¶
Lit-шаблоны пишутся с помощью литералов шаблонов JavaScript, помеченных тегом html. Содержимое литерала — это в основном обычный, декларативный HTML:
1 | |
Синтаксис шаблона может выглядеть так, будто вы просто выполняете интерполяцию строк. Но при использовании тегированных литералов шаблонов браузер передает функции тегов массив строк (статические части шаблона) и массив выражений (динамические части). Lit использует это для создания эффективного представления вашего шаблона, чтобы повторно отобразить только те части шаблона, которые изменились.
Шаблоны Lit чрезвычайно выразительны и позволяют отображать динамический контент различными способами:
- Выражения: Шаблоны могут включать динамические значения, называемые выражениями, которые могут быть использованы для отображения атрибутов, текста, свойств, обработчиков событий и даже других шаблонов.
- Условные выражения: Выражения могут выводить условное содержимое, используя стандартный контроль потока JavaScript.
- Списки: Вывод списков путем преобразования данных в массивы шаблонов с использованием стандартных методов циклов и массивов JavaScript.
- Встроенные директивы: Директивы — это функции, которые могут расширить функциональность шаблонов Lit. Библиотека включает в себя набор встроенных директив, которые помогают в различных задачах рендеринга.
- Пользовательские директивы: Вы также можете написать свои собственные директивы, чтобы настроить рендеринг Lit по своему усмотрению.
Автономный шаблонизатор¶
Вы также можете использовать библиотеку шаблонов Lit для автономного шаблонирования, вне компонента Lit. Подробности см. в Автономные шаблоны lit-html.