typescript - 如何在 vaadin-combo-box 中指定默认值？

Question

我使用 lit 和 vaadin-combo-box 创建了一个组合框组件。我能够毫无问题地创建组合框，但我不知道如何设置默认值。如何在选择之前将默认值设置为“标签 1”？

import {customElement} from 'lit/decorators.js';
import {html, LitElement} from 'lit';

const items = [
  {'label': 'Label 1', 'value': 'label1'},
  {'label': 'Label 2', 'value': 'label2'},
];

@customElement('my-element')
export class MyElement extends LitElement {
  render() {
    return html`
      <vaadin-combo-box
          label="combo box"
          .items="${items}"
          required
      >
      </vaadin-combo-box>
    `;
  }
}

Answer 1

对于设置默认元素，您可以设置selectedItem对象的属性。

const el = this.shadowRoot.getElementById('my-box');
el.selectedItem = items[0].label;

请参阅此内容以获取更多参考。

此外，还可以直接在 HTML 元素中设置值：

<vaadin-combo-box value="${items[0].label}"></vaadin-combo-box>