【问题标题】:Download with file name defaulting to date-time of user event in Vaadin Flow app下载文件名默认为 Vaadin Flow 应用程序中用户事件的日期时间
【发布时间】:2020-03-17 19:48:46
【问题描述】:

在我的 Vaadin Flow 网络应用程序(版本 14 或更高版本)中,我想向我的用户提供一个链接,该链接将向他们下载数据文件。要下载的文件的默认名称应在用户开始下载时确定。

我知道 Vaadin Flow 中的 Anchor 小部件。使用Anchor,下载文件的默认名称将是链接 URL 中给出的资源名称。不幸的是,这是在页面加载时确定的,而不是在用户单击链接时确定的。因此,这种方法无法满足我用用户启动下载时捕获的日期时间标记下载的需要。

String when = Instant.now().toString().replace( "-" , "" ).replace( ":" , "" ); // Use "basic" version of standard ISO 8601 format for date-time.
StreamResource streamResource = new StreamResource( "rows_" + when + ".txt" , ( ) -> this.makeContent() );
Anchor anchor = new Anchor( streamResource , "Download generated data" );

也许解决方案是使用Button 小部件而不是Anchor高级主题 > Dynamic Content 页面的手册中显示了使用动态创建内容的按钮。不幸的是,那里的示例在页面上加载资源,而不是为用户进行下载。

➥ Vaadin Flow 中的Button 可以用来启动下载吗?

➥ 是否有其他方法可以使用在用户启动下载时而不是在页面加载时确定的 URL 来启动下载?

【问题讨论】:

    标签: download vaadin vaadin-flow


    【解决方案1】:

    是否可以使用 Vaadin Flow 中的按钮来启动下载?

    是的,但它需要一些客户端实现。目录中有File Download Wrapper 附加组件,它执行此操作。可以包装例如Button。但是我认为它不会完全解决您的问题。我怀疑在单击事件中设置文件名不会适用(为时已晚)。但我确实认为,可以将文件名提供程序回调功能添加到此插件中。

    【讨论】:

      【解决方案2】:

      考虑这个模拟点击客户端动态添加的Anchor的HACK:

          private void downloadWorkaround(Component anyComponent, int delay) {
              Anchor hiddenDownloadLink = new Anchor(createStreamResource(), "Workaround");
              hiddenDownloadLink.setId("ExportLinkWorkaround_" + System.currentTimeMillis());
              hiddenDownloadLink.getElement().setAttribute("style", "display: none");
              var parent = anyComponent.getParent().orElseThrow();
              var parenthc = (HasComponents) parent;
              for (Component c : parent.getChildren().collect(Collectors.toList())) {
                  if (c.getId().orElse("").startsWith("ExportLinkWorkaround_")) {
                      // clean up old download link
                      parenthc.remove(c);
                  }
              }
              parenthc.add(hiddenDownloadLink);
              UI.getCurrent().getPage().executeJs("setTimeout(function(){" + // delay as workaround for bug when dialog open before
                      "document.getElementById('" + hiddenDownloadLink.getId().orElseThrow() + "').click();"
                      + "}, " + delay + ");"
              );
          }
      

      在按钮单击事件或其他事件上调用该方法。有时需要额外的delay。对我来说,延迟是从模态对话框“确定”按钮开始下载所必需的,该按钮也关闭了对话框。但也许你甚至不需要那个。

      我对 Tatu 提到的针对我的特定用例的文件下载包装插件没有运气:我想在某些情况下显示一个对话框,然后再向用户提供下载。

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2011-01-05
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多