解决移动端软键盘弹出，布局错位mixin

// assets/js/mixin.js

let mixin = {
    mounted() {
      var m = navigator.userAgent
      //解决iPhone6s plus 失去焦点以后，先隐藏软键盘，再弹出  (主要原因是setTimeout引起的，没有setTimeout就不会出现这个bug)
      if(m.indexOf('Mozilla/5.0 (iPhone; CPU iPhone OS 12_2 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Mobile/15E148')!=-1){
        let $inputs = Array.from(document.getElementsByTagName('input'))
      let body = document.body;
      $inputs.forEach(item => { 
        item.onblur = function () { // onblur是核心方法
          document.body.scrollTop = document.documentElement.scrollTop = 0
        }
      })
      }else{
            setTimeout(() => {
              var isIos = !!m.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)
              // 解决页面在苹果手机上 输入法点完成后 页面没有复原 导致页面错乱
              if (isIos) {
                let $inputs = Array.from(document.getElementsByTagName('input'))
                let body = document.body;
                $inputs.forEach(item => { // 定时器是处理多个input间快速切换闪屏问题
                  item.onblur = function () { // onblur是核心方法
                    clearTimeout(body.timer);
                    body.timer = setTimeout(() => {
                      document.body.scrollTop = document.documentElement.scrollTop = 0
                    }, 150)
                  }
                  item.onfocus = function () {
                    clearTimeout(body.timer)
                  }
                })
              }
            },200)
      }
    },
}
export default mixin

全局引用：

// main.js
import mixin from './assets/js/mixin'

new Vue({
  router,
  store,
  axios,
  mixins: [mixin],
  render: h => h(App)
}).$mount('#app')