模板概述

Lit 模板使用带有 html 标签的 JavaScript 模板字面量编写。字面量的内容主要是普通、声明式的 HTML

html`<h1>Hello ${name}</h1>`

模板语法可能看起来像你只是在做字符串插值。但是使用带标签的模板字面量，浏览器会将标签函数传递给字符串数组（模板的静态部分）和表达式数组（动态部分）。Lit 使用它来构建模板的高效表示，以便它可以仅重新渲染已更改的模板部分。

Lit 模板非常具有表现力，允许您以多种方式渲染动态内容

• 表达式：模板可以包含称为表达式的动态值，这些值可用于渲染属性、文本、属性、事件处理程序，甚至其他模板。
• 条件语句：表达式可以使用标准 JavaScript 流控制渲染条件内容。
• 列表：使用标准 JavaScript 循环和数组技术将数据转换为模板数组，从而渲染列表。
• 内置指令：指令是函数，可以扩展 Lit 的模板功能。该库包含一组内置指令，可以帮助满足各种渲染需求。
• 自定义指令：您也可以编写自己的指令来根据需要自定义 Lit 的渲染。

您还可以使用 Lit 的模板库进行独立模板，超出 Lit 组件范围。有关详细信息，请参阅 独立 lit-html 模板.

编辑此页面