【土旦】vue 解决ios H5底部输入框获取焦点时弹出虚拟键盘挡住输入框以及监听键盘收起事件

问题描述

im聊天H5页面，在iOS系统下，inpu获取焦点弹出系统虚拟键盘时，会出现挡住input的情况，十分影响用户体验。

bug图

解决方法：

html：

js：

setTimeout(()=>{

　　this.$refs.inputShow.scrollIntoView();

　　document.body.scrollTop = document.body.scrollHeight;

},100)

问题描述

　　在IOS键盘点击发送并不会执行按钮事件

解决方法

1、在 mounted 生命周期里面 加一个全局事件监听

    document.body.addEventListener('focusout', () => {

        //软键盘关闭事件

    })    

2、给input加失去焦点事件

记录走过的路，踩过的坑，互勉。

　　前端交流群：87709616

有不同意见的可以留言，我们一起讨论。

巴特西