解决移动端H5页面点击输入框弹出键盘时将底部导航栏挤至上面

1.将导航栏position改为static或者relative

position: relative | static;

 2.如果不方便设置导航栏定位方式,可以监听浏览器输入框聚焦事件.

点击输入框 --> 触发浏览器focusin事件  -->  隐藏底部导航栏  ( --> 弹出键盘) --> 输入完成 --> 触发浏览器focusout事件 (--> 收起键盘) --> 重新渲染导航栏

document.body.addEventListener('focusin', () => {
              //改变导航栏display或者v-if隐藏导航栏

      })

document.body.addEventListener('focusout', () => {
              //改变导航栏display或者v-if重新渲染导航栏 

      })