在 Lit 中，大多数事情都从定义_组件_开始。这里我们为你提供了一个包含必要导入的起始项目。

• 定义一个组件。

  @customElement('my-element')
  export class MyElement extends LitElement {
  }

  export class MyElement extends LitElement {
  }
  customElements.define('my-element', MyElement);

  MyElement 类为你的新组件提供了实现。 @customElement 装饰器将其注册为名为 my-element 的新元素类型。customElements.define 调用将其注册为名为 my-element 的新元素类型。

  "TODO" 文本应从 Result 面板中消失，表明组件已定义。但你的组件还缺少一些东西——它没有显示任何内容。

• 为你的类添加 render() 方法。

  render() {
    return html`
      <p>Hello world! From my-element.</p>
    `;
  }

  render() 方法定义了组件的内部 DOM。html 标签函数处理模板字面量并返回一个 TemplateResult——一个描述 Lit 要渲染的 HTML 的对象。每个 Lit 组件都应包含一个 render() 方法。

你应该在 Result 面板中看到问候消息。