模板概述

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

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

模板语法看起来像是在进行字符串插值。但通过标记模板字面量，浏览器会向标签函数传递一个字符串数组（模板的静态部分）和一个表达式数组（动态部分）。Lit 使用这一特性构建模板的高效表示，因此它只需重新渲染模板中已更改的部分。

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

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

你还可以在 Lit 组件之外使用 Lit 的模板库进行独立模板处理。有关详细信息，请参阅独立的 lit-html 模板。