Vaadin键盘滚动

Question

我在Vaadin中设置了keylisteners，以便在特定任务中使用箭头键。因此，我不能使用箭头键滚动页面，所以我将keylisteners设置为ctrl+arrow来执行此功能。现在我现在使用JS函数调用来进行滚动：

window.Scroll = {
scroll: function(amount, idOfWrapper){
var element = document.getElementById("container-of-" + idOfWrapper);
element.scrollBy({top:amount, behavior: 'smooth'});
}

}

我的问题是，这不允许我连续滚动页面，因为平滑的滚动行为(我需要(。我怎样才能做到这一点？

Java代码：

ShortcutEventListener listener = event -> {
...
} else if(event.matches(Key.ARROW_DOWN, KeyModifier.CONTROL)) {
UI.getCurrent().getPage().executeJs("Scroll.scroll($0, $1)", scrollAmount, 
idOfWrapper); 
} else if(event.matches(Key.ARROW_UP, KeyModifier.CONTROL)) {
UI.getCurrent().getPage().executeJs("Scroll.scroll($0, $1)", scrollAmount, idOfWrapper); 
}
};

...    
UI.getCurrent().addShortcutListener(listener, Key.ARROW_DOWN, KeyModifier.CONTROL);
UI.getCurrent().addShortcutListener(listener, Key.ARROW_UP, KeyModifier.CONTROL);

Answer 1

这不是你问题的答案，而是一些友好的建议。我想指出的是，试图用自己的代码重现原生滚动行为会导致一个很深的兔子洞，这可能会导致各种边缘情况和浏览器特定的问题。除了将滚动行为更改为箭头键+修饰符是非常不直观的之外，没有用户会明白这一点。

如果我必须支持原生键盘滚动，我就不会乱用普通的箭头键。相反，我会考虑使用不同的快捷方式进行自定义导航(例如箭头键+修饰符(。然后在navigatable元素中添加帮助文本，以便用户了解它们。或者，我会检查是否可以更改需求，以便只有当用户关注了应该支持导航的特定元素时，才会触发快捷方式。