vaadin - Vaadin v22 DateTimePicker 组件渲染两次

Question

我有一个带有 DateTimePicker 组件的 Vaadin 表单，该组件呈现两次。我一直无法确定是什么原因造成的。表单模板由 Vaadin Designer 生成。

Vaadin 版本：22 Vaadin 插件版本：4.6.11

LitElement 模板：

import { LitElement, html, css, customElement } from 'lit-element';
import '@vaadin/vaadin-form-layout';
import '@vaadin/date-time-picker';

@customElement('input-form')
export class InputForm extends LitElement {
  static get styles() {
    return css`
      :host {
          display: block;
          height: 100%;
      }
      `;
  }

  render() {
    return html`
      <vaadin-form-layout>
        <vaadin-date-time-picker id="appearanceDt" label="Appearance Date" .step="${60 * 15}"></vaadin-date-time-picker>
      </vaadin-form-layout>
    `;
  }

  // Remove this method to render the contents of this view inside Shadow DOM
  createRenderRoot() {
    return this;
  }
}

Java模板类：

@Tag("input-form")
@JsModule("./src/views/input-form.ts")
public class InputForm extends LitTemplate {

@Id("appearanceDt")
private DateTimePicker appearanceDt;

呈现的页面：

同样有趣的是，只有第一对元素绑定到 Java 模板类。其他两个不绑定：

Answer 1

升级到版本 22.02 完全解决了这个问题。