激活屏幕键盘后，如何确保焦点输入保持可见性

Question

在构建移动优先网站时，我遇到了一个常见的问题，即激活移动设备上的屏幕键盘后，输入元素可能会被覆盖。

如果我使用React Native构建本机应用程序，则可以使用KeyboardAvoidingView：

  

KeyboardAvoidingView

     

它是解决视图的常见问题的组件，这些视图需要移开虚拟键盘。它可以根据键盘的位置自动调整其位置或底部填充。

     

^{-https://facebook.github.io/react-native/docs/keyboardavoidingview}

当激活屏幕键盘时，如何确保焦点输入保持可见？

我考虑过在窗口上监听resize事件，并集中最后关注的输入，但是我不确定这可能有什么副作用，或者不确定是否可行。

Answer 1

调整大小事件可能是您最好的选择。像这样：

document.activeElement.scrollIntoView() 

应该可以解决问题。