vue移动端安卓软键盘弹出底部按钮顶起

最新推荐文章于 2023-09-15 10:28:10 发布

原创

最新推荐文章于 2023-09-15 10:28:10 发布 · 1.2k 阅读

1 ·

CC 4.0 BY-SA版权

本文探讨了Vue移动端应用中遇到的问题，当安卓设备软键盘弹出时，底部固定布局的确认按钮被顶起。文章介绍了两种解决方法：一是监听页面高度变化以调整按钮位置；二是利用jQuery在键盘弹出和收起时动态改变按钮的定位。第二种方法虽然能解决问题，但可能带来轻微的卡顿现象。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

这里确认按钮是fixed布局 bottom:0 弹出键盘之后按钮被顶到了键盘上面

一、显示隐藏处理

监听页面高度

data() {
   
   
    return {
   
   
        docmHeight: document.documentElement.clientHeight ||document.body.clientHeight,
        showHeight: document.documentElement.clientHeight ||document.body.clientHeight,
        hideshow:true  //显示或者隐藏footer
    }
  },

mounted() {
   
   
      //监听事件
      window.onresize = ()=>{
   
   
          return