lit-html 和 lit-element 写个组件带方法的

首先，需要安装 lit-html 和 lit-element：

npm install lit-html lit-element

然后，创建一个新的组件类：

import { LitElement, html } from 'lit-element';

class MyComponent extends LitElement {
  static get properties() {
    return {
      message: { type: String }
    };
  }

  constructor() {
    super();
    this.message = 'Hello, World!';
  }

  render() {
    return html`
      <div>
        <p>${this.message}</p>
        <button @click=${this.handleClick}>Click me</button>
      </div>
    `;
  }

  handleClick() {
    alert('Button clicked!');
  }
}

customElements.define('my-component', MyComponent);

在 `properties` 中定义了组件的属性，`message` 的类型为字符串。在构造函数中，初始化了 `message` 的值为 `'Hello, World!'`。

在 `render` 方法中，使用了 lit-html 的模板语法，将 `message` 展示在 `<p>` 标签中，并添加了一个按钮，当按钮被点击时，会调用 `handleClick` 方法。

最后，使用 `customElements.define` 方法将组件注册到自定义元素中，这样就可以在 HTML 中使用 `<my-component>` 标签了。

在 HTML 中使用组件：

<my-component></my-component>

这将显示一个包含 `Hello, World!` 文本和一个按钮的组件。当按钮被点击时，会弹出一个弹窗，显示 `'Button clicked!'`。