如何为启用了多行拖动模式的Vaadin表行设置样式

Question

问题

最近我在Vaadin应用程序中遇到了一个奇怪的错误。拖动表格行时，该行有时会出现在与鼠标光标不同的位置。我还注意到拖动的行没有正确的CSS样式。

我通过转到Vaadin Sampler复制了Table demo页面上的行为，启用了MULTIROW拖动模式并在Chrome中应用了一些自定义CSS，使其更加清晰可见。

这是我使用的CSS：

.v-table .v-table-row .v-table-cell-content {
   background-color: red;
   font-size: 3em;
}

奇怪的是，这只会在拖动当前选中的行并启用 MULTIROW 拖动模式时才会发生。

我无法了解拖动行代码的外观。此外，谷歌搜索有关样式拖动项目的任何信息都没有产生任何结果。

但我发现，拖动的行存在于表组件的范围之外，这意味着具有特定于表的选择器的CSS规则不再适用。

解决方案

1. 将拖动模式更改为 ROW （但我猜您有理由想要MULTIROW）
2. 将您的CSS更改为不太具体的规则 - 即“.our-awesome-class”而不是“.v-table .v-table-row .v-table-cell-content .our-awesome-class”。虽然这可能会很好，但它会使你的规则更加通用，并可能破坏你的风格。
3. 我搜索了Vaadin主题文件，找到了 v-drag-element 类。此类出现在拖动的行上，但我无法使其适用于选定的行。

问题

有谁知道如何正确地做到这一点？

它在我看来就像一个Vaadin错误（因为它似乎在没有MULTIROW模式的情况下运行良好）。