组件概览

Lit 组件是一段可复用的 UI。你可以把 Lit 组件想象成一个容器，它拥有一些状态，并根据这些状态来显示 UI。它还可以响应用户输入、触发事件——任何你期望 UI 组件能做到的事情。而且 Lit 组件是一个 HTML 元素，因此它拥有所有标准的元素 API。

创建一个 Lit 组件涉及以下概念：

• 定义组件。Lit 组件通过一个自定义元素来实现，并在浏览器中注册。

• 渲染。组件有一个render 方法，它会被调用来渲染组件的内容。在 render 方法中，你为组件定义一个模板。

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

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

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

以下是一个示例组件：