问题标签 [vaadin14]

我正在将我的 Spring Boot + Vaadin 应用程序从“Vaadin 13 兼容模式”中的 Vaadin 14 切换到“本机 Vaadin 14 模式”。这主要是因为我想使用 Vaadin Gradle 插件以便能够启用生产模式。这也需要从Full Calendar web 组件升级到Full Calendar 4 web component，它现在支持 Vaadin 14+ 并且还包装了更新版本的FullCalendar。不幸的是，很多事情需要同时发生。

我现在遇到的问题是，当显示 FullCalendar 组件时，我收到此客户端错误：

(ReferenceError) : 时刻未定义

我看到 FullCalendar Web 组件 jarFullCalendar在包中的类上有这些注释org.vaadin.stefan.fullcalendar：

之所以在这里列出前两个，可能是因为它们被定义为后两个的对等依赖项，因此不会自动安装。

我还注意到 FullCalendar 4 Web 组件页面提到了以下已知问题：

构建问题/JS（客户端）错误（V14+）

可能是传递依赖没有正确解析。

如果您使用的是 Spring Boot，请将 @EnableVaadin 注释添加到您的应用程序类中。添加包 org.vaadin.stefan 加上你的根包作为参数。这应该使 Spring 能够在运行时分析所有 npm 依赖项。其他 CDI 版本应该工作相同。

所以我在我的应用程序类中添加了这个注释：

但这似乎不起作用。

我也尝试过运行 gradle 任务vaadinBuildFrontend而不是 just vaadinPrepareFrontend，但这并没有什么不同。

我还应该做些什么来确保moment正确加载和初始化？

更新：如果我明确启用vaadin.productionModein build.gradle，那么错误就消失了。当然，我也希望能够在开发模式下运行应用程序。

更新 2：我已经尝试从提供的基础项目创建一个干净的 Vaadin + Spring Boot + Gradle 项目。我注意到一个不同之处：在我自己的应用程序中，我收到了一条警告：

...我没有进入干净的项目。我在那里得到了以下我自己的项目中没有的日志记录行：

UDPATE 3：我发现该moment()函数实际上是从使用calendar.getElement().executeJs(...). 显然，该功能在该范围内是未知的。也许是由于严格模式？不确定这是否解释了为什么它在生产模式下工作。

为了在我的 UI 中选择不同数据类型的一些值，我使用DateTimePicker了 14.3.x 中引入的Vaadin。

我想知道我是否可以以某种方式垂直而不是水平放置日期和时间输入字段？看图片：

DateTimePicker 组件在这里只是水平宽度。而且我也没有选择使所有其他输入（例如用于字符串的输入）更宽。

我已经检查了API，但似乎没有实现垂直堆叠的标准方法。有谁知道如何完成这项工作？

我最近将我的应用程序切换到 Vaadin 14 本机 NPM（非兼容模式）和生产模式。Vaadin 版本是 14.3.7。这是一个使用 Gradle 打包为可执行 .war 文件的 Spring Boot 应用程序。我正在使用 Vaadin Gradle 插件。

一切正常，除了在应用程序不可用的 Safari (iOS + Mac) 中。在 Mac 上可以看到以下错误：

我发现消息来源说 ES6 模块可能会在 Safari 上导致此错误，但我认为 Vaadin 默认在生产模式下转换为 ES5。

我该怎么做才能让 Safari 也能正常工作？

更新文件 中的一些相关部分build.gradle：

所以我有一个 RequestHandler（使用 VaadinServiceInitListener）：

在 RequestHandler 中，我想检查用户是否登录。到目前为止，一切都很好。

如果用户已登录，则该请求将被照常处理。如果没有，我想将他重定向到登录页面。请求处理程序有可能吗？

我使用了 UI 类的导航方法，如下所示：

但问题是在请求时，没有实例化 UI，所以我会得到一个 NPE。

我正在我的移动设备（华为 p30 pro）上测试我的 vaadin 应用程序的注册屏幕。对于注册过程，我使用表单“铁形式”元素。我把它放到垂直布局中。一般来说，屏幕上总是有一个导航栏。在桌面视图中，导航栏出现在顶部，而在移动设备上，它出现在屏幕底部。但是，当我打开键盘（Android 的软键盘）时，导航栏被向上推到屏幕顶部，并且注册表单的垂直布局表现不佳，因为我无法在垂直布局内滚动。例如，当我打开键盘时，如果我向下注册按钮，我无法向上滚动到屏幕顶部的用户名文本字段。导航栏与视图重叠（在第二张图中实现，电子邮件字段上方的文本字段不可见且不可滚动）。我该如何解决这个问题？提前致谢..

打开键盘后

我的注册页面如下所示：

我的注册表单的css文件如下：

还有我用于导航栏的 css 文件

在此处输入图像描述如何在 Vaadin 网格单元格中显示多行数据。

尝试使用带有字符串的 \n ，但仍显示在一行中。

在 Vaadin 14.4.2 中，我有一个场景，我在 splitLayout 中添加了一个图表。但是，当我作为用户扩展或缩小 splitLayout 时，相应的图表不会调整大小。其他组件（例如网格）会自动调整大小。是否有一些“神奇”的配置选项可以让图表表现得像其他组件一样？（下面的屏幕截图显示图表没有调整大小，即使它下面的网格确实正确地自动调整了大小。）（另外，我称之为：spectraChart.setSizeFull();所以图表应该用完所有可用空间。）（另一个仅供参考：我可能会“捕获” splitLayout 调整大小，即使然后重做绘图，但在我看来，理想情况下这在“框架”中是不必要的解决方案，例如 Vaadin，因为图表是一个组件，其行为应该与其他组件（例如网格）一样。）

在 Vaadin 14.4.2 中，我有一个带有右侧“图表菜单”按钮的图表，允许用户将图表下载为各种格式（例如 png、jpeg 等）。但是，当我将图表下载为 png 时，它会被严重“压扁”。它看起来不像我的用户屏幕上显示的图表。我原以为分辨率至少与用户在自己的屏幕上看到的一样好。为什么 Vaadin 图表会转换分辨率？换句话说，有没有一种简单的方法可以让“下载到 png”看起来与用户在他的屏幕上看到的一样？（更糟糕的是，我将禁用“下载到文件”图表功能，因为大多数用户可能知道如何截取屏幕截图，但我希望下载功能能够工作，因为它会产生“

现在是 png：您可以清楚地看到它看起来不像上面屏幕截图中的图表。由于某种原因，它的分辨率要低得多。

在 Vaadin 14.4.2 中，是否可以通过以编程方式计算系列颜色的方式创建具有多个系列的图表？具体来说，我可能有大约 100 个系列，但它们都与“数字”（特别是化学元素的质量）相关联。因为我知道在我的应用程序中“数字”（即质量）的范围是 100 到 2000，所以我希望系列的颜色范围从蓝色（100）到红色（2000）。这样，当用户查看图表时，他们可以直观地知道该系列是指重化学品（红色）还是轻化学品（蓝色）。

为了实现这一点，我认为我需要某种方式以编程方式设置系列的颜色，但我认为这在 Vaading 14.4.2 中实际上是不可能的，对吧？

以下是此类图表的示例：

在 Vaadin 14.4.2 中，我有一个带有选项卡的对话框；在第一个选项卡中，我有一个拆分器。我调整了拆分器的大小，它看起来不错（图 1）。但是，如果我单击另一个选项卡（例如“Quant By Sample”）然后返回到第一个选项卡（图 1 中的原始选项卡），它已经忘记了我的拆分器的位置。（见图2）；相反，它似乎已经用分离器的默认位置“刷新”了屏幕。这是一个错误吗？如果是这样，是否有安全/稳定的解决方法（或者我们应该等待修复？）

图 1：在第一个选项卡上，调整大小后

图 2：在我点击另一个选项卡然后返回到原来的选项卡后：