无法在 Vaadin 视图中从 @JavaScript import 调用 JS 函数

Question

我有这样的瓦丁观点：

@Route()
@JavaScript(value="scripts/print.js")
public class PrintableView extends BaseView {


    @Override
    public void setParameter(BeforeEvent event, @OptionalParameter String parameter) {
        super.setParameter(event, parameter);
    }

    @Override
    protected void onAttach(AttachEvent attachEvent) {
        UI.getCurrent().getPage().executeJs("printWhenLoaded($0);",".layout");
    }
    

}

以及 JavaScript 导入：

function printWhenLoaded(selector) {
  setTimeout(function () {
    var e = document.querySelector(selector);
    if(e && e.innerHTML.length) {
        window.print();
        window.close();
    }
    else printWhenLoaded(selector)
  }, 200)
};
//printWhenLoaded('.layout');

导入成功加载（最终），因为当我取消注释最后一行时，它起作用了。但是，当尝试从 onAttach 方法调用它时，我在浏览器控制台中看到一个错误，指出“printWhenLoaded”未定义。

看来在 onAttach 时，JS 文件实际上还没有被浏览器加载。

Answer 1

您的问题是您没有在正确的范围内定义该函数，而不是该文件没有从该方法加载和可用onAttach。最简单的方法是在window对象中定义函数：

window.printWhenLoaded = function (selector) {
  // ...
}