Vaadin @Tag 注解

【问题标题】：Vaadin @Tag annotationVaadin @Tag 注解
【发布时间】：2018-03-20 05:46:10
【问题描述】：

我对 vaadin @Tag 注释有疑问。当我在我的组件中使用这样的 @Tag("main-page") Edge 和 FF 得到意外的类名。

@Tag("main-page")
@HtmlImport("src/page/home.html")
@Viewport("width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=no")
public class HomeView extends PolymerTemplate<HomeView.Model> implements RouterLayout, HasUrlParameter<String>,

FF 和 Edge 上的结果：

但在 chrome、safari、opera 中：

有什么解释吗？我做错了什么？

【问题讨论】：

标签： vaadin vaadin10

【解决方案1】：

您看到的情况是因为当前版本的 Edge 和 Firefox 本身不支持 Shadow DOM。您可以通过 DOM 树中缺少特殊的 #shadow-root 节点来看到这一点。

Vaadin 使用的是模拟大部分功能的 polyfill，而不是原生支持。这个 polyfill 仍然有一些可见的副作用，例如一些用于模拟样式封装功能的额外 CSS 类。

这绝不是特定于 @Tag 注释甚至是一般的 Vaadin，而是来自生态系统的东西（例如 extends Polymer.Element，您将在 home.html 文件中拥有）。

【讨论】：