组件概述

Lit 组件是可重用的 UI 片段。你可以将 Lit 组件视为一个拥有某些状态并基于其状态显示 UI 的容器。它还可以响应用户输入、触发事件——你期望 UI 组件做的任何事情。而且 Lit 组件是一个 HTML 元素，因此它拥有所有标准元素 API。

创建 Lit 组件涉及多个概念：

• 定义组件。Lit 组件实现为自定义元素，在浏览器中注册。

• 渲染。组件有一个渲染方法，用于渲染组件的内容。在渲染方法中，你为组件定义一个模板。

• 响应式属性。属性保存组件的状态。更改组件的一个或多个_响应式属性_会触发更新周期，重新渲染组件。

• 样式。组件可以定义_封装样式_来控制自身外观。

• 生命周期。Lit 定义了一组回调，你可以重写这些回调以挂钩到组件的生命周期——例如，在元素添加到页面时或组件每次更新时运行代码。

这是一个示例组件：