vaadin - 在 Vaadin 14 应用程序中执行 JS 代码什么都不做

Question

我试图在页面加载时进行简单的向下滚动。

@Route("somthing")
public class SomeView extends VerticalLayout{

public SomeView(){
    ...
    Adding some Elements
    ...

    UI.getCurrent().getPage().executeJs("window.scroll(0,300)");
}
}

我还尝试在窗口中添加一个侦听器：

 UI.getCurrent().getPage().executeJs("window.addEventListener('onload', function(){console.log('trigger');window.scroll(0,300);});");

但是在这两种情况下，页面加载时都没有发生任何事情。

Answer 1

就像评论中提到的 Olli 一样，第二个不起作用，因为 onload 事件在您添加事件侦听器时已经发生。

我相信第一个不起作用，因为SomeView尚未附加到页面（当您在构造函数中执行 js 时），因此页面还没有足够的内容可以滚动。您应该在 View
的方法中执行该 javascript 。onAttach

@Route("somthing")
public class SomeView extends VerticalLayout{

    public SomeView(){
        ...
    }

    @Override
    public void onAttach(AttachEvent attachEvent) {
        UI.getCurrent().getPage().executeJs("window.scroll(0,300)");
    }
}

Answer 2

只需使用getElement()而不是UI.getCurrent().getPage()

@Route("something")
public class SomeView extends VerticalLayout{

  public SomeView(){
    ...
    Adding some Elements
    ...

    getElement().executeJs("window.scroll(0,300)");
  }
}

在您的SomeView的构造函数中。