工作中遇到的问题总结

1、问题：安卓手机点击input框，会被键盘挡住

解决方案：写个js即可

 // 处理安卓手机输入法遮挡输入框问题
    if ((/Android/gi).test(navigator.userAgent)) {
        window.addEventListener('resize', function () {
            if (document.activeElement.tagName == 'INPUT' || 
                document.activeElement.tagName == 'TEXTAREA') {
                window.setTimeout(function () {
                    document.activeElement.scrollIntoViewIfNeeded();
                }, 0);
            }
        });
    } 

最终效果：

安卓手机点击输入框时，会判断该输入框是否在可视区域，不在时会自动置于可视区域。

苹果手机点击输入框时，不管该输入框是否在可视区域，都会将输入框置于可视区域最中间。

2、问题：单页面开发跳转页面后页面还停留在前一个页面的位置，不会自动回到顶部

解决方案：在路由钩子router.afterEach方法中加入一行代码：

document.body.scrollTop = document.documentElement.scrollTop = 0;

最终效果：

每次跳转页面之后页面的滚动距离都重置为0，页面就能回到顶部。