组件概述
Lit 组件是可重用的 UI 部分。可以将 Lit 组件视为具有某些状态的容器,该容器根据其状态显示 UI。它还可以响应用户输入,触发事件——您期望 UI 组件执行的任何操作。Lit 组件是一个 HTML 元素,因此它具有所有标准元素 API。
创建 Lit 组件涉及许多概念
定义组件。Lit 组件以自定义元素的形式实现,并向浏览器注册。
渲染。组件具有渲染方法,该方法用于渲染组件的内容。在渲染方法中,您定义了组件的模板。
反应式属性。属性保存组件的状态。更改组件的一个或多个反应式属性会触发更新循环,重新渲染组件。
样式。组件可以定义封装样式来控制其自身的外观。
生命周期。Lit 定义了一组回调,您可以覆盖这些回调来挂钩组件的生命周期——例如,在元素添加到页面时运行代码,或在组件更新时运行代码。
以下是一个示例组件
此示例使用 TypeScript 装饰器。
有关为装饰器配置 TypeScript 的更多信息,请参阅装饰器文档。