如何从独立于 Vaadin View 的 JS 调用后端方法？

Question

我有以下场景。 Javascript 在前端执行并对事件做出反应。如果捕获到事件，则会调用特定的后端方法。

我像下面这样初始化后端。该方法在我的 Vaadin 14 视图之一的初始化过程中被调用。

window.init = function(element) {
    window.element = element;
    ...
}

查看：

public class TestView extends Div {
   public TestView() {
      ...
      UI.getCurrent().getPage().executeJs("init([=11=])", this);
   }
}

稍后在前端使用 window.element.$server.onTestEvent(); 调用方法。

调用的后端方法：

@ClientCallable
private void onTestEvent() {
    System.out.println("Test");
}

现在问题：

我将视图传递为 element。

如果我更改视图，我传递的 element 将被销毁，因此事件（在后端）即使在前端被捕获也无法执行。

Vaadin 14 是否提供了一种在所有视图上存储对象 "globally" 的方法？我希望应用程序根据我当前访问的视图对事件做出反应。

Answer 1

最简单的解决方案是使用顶级主布局（视图容器/MainView）的元素而不是单个视图的元素。

How to call backend methods from JS independent from Vaadin View?