Vaadin流:组件和元素之间的差异

时间:2018-08-16 09:13:44

标签: java vaadin vaadin-flow

在Vaadin Flow中,除了组件之外,现在还有元素。

在Element的javadoc中说:

  

组件是元素或元素层次结构的更高级抽象。

这实际上是什么意思?在更高级别上以及在使用元素和组件时会做什么?

1 个答案:

答案 0 :(得分:6)

作为一个实际示例,让我们考虑HTML标记TogglePropertyAction。您可以创建服务器端<input>实例,该实例在浏览器中为您提供一个Element的{​​{1}}。

此外,假设您要配置元素的占位符文本,例如<input>。使用Element myElement = new Element("input") API,它就是<input placeholder="Enter your name here">

作为最后一个示例,您还添加了一个侦听器,该侦听器将值更改事件转发到服务器。您还需要配置浏览器事件的哪一部分发送到服务器并在侦听器中访问该值:Element

您可以以这种方式构建整个应用程序,但这并不方便。您希望有一个知道标记名称为myElement.setAttribute("placeholder", "Enter your name here")的类,而不必每次都键入该字符串。您需要一种myElement.addEventListener("change", event -> System.out.println("New value: " + event.getEventData("element.value")).addEventData("element.value");方法,而不是使用通用的input并记住属性的名称。最后,您需要一种添加值更改侦听器的方法,其中新值可以作为setPlaceholder使用。

这正是setAttribute输入图片的地方。它使您可以创建扩展event.getValue()的{​​{1}}类,并为这些功能提供Java API。在幕后,Component组件将使用Input API,但会将其隐藏为Component类的用户不必知道的实现细节。

此外,一个组件也可以基于其他组件,而不是直接使用Input。通常,这就是您创建组成例如您的应用程序中的视图。