- 注重用户体验,积累开发经验
在开发H5应用时,很可能会遇到:在用户输入时,弹出的小键盘遮挡输入框,导致当前正在输入的内容无法看见,那如何解决呢?
使用一个不太常用的方法: Element.scrollIntoView() 点击查看MDN文档说明
scrollIntoView() 方法会滚动元素的父容器,使被调用 scrollIntoView() 的元素对用户可见。
本方法亲测可用
mounted(){
this.scrollIntoView()
},
methods: {
//输入施工费用时,调整页面scroll高度
scrollIntoView() {
window.addEventListener("resize", () => {
document.activeElement.scrollIntoView(true);
});
},
},
unmounted() {
window.removeEventListener("resize");
}
网友评论