IOS

1、一个input框弹出软键盘，关闭软键盘后导致iOS顶部留白问题

解决方法： @blur="fixScroll"

<input type="text"  @blur="fixFocus"  />

// ios软键盘弹出空白 
fixScroll() { 
  let u = navigator.userAgent;
  let isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
  if (isiOS) {
    window.scrollTo(0, 0);
  }
},

2、两个（多个）input框的软键盘问题，关闭软键盘后导致iOS顶部留白问题

遇到的问题：在微信浏览器中进行编辑时Ios 键盘弹起会把页面向上顶起，然后键盘’完成’隐藏后页面没有复位，确认变更 按钮这时是错位的无法触发。

  onMounted(() => {
      fixFocus()
    })

// 解决ios输入框弹出空白问题
    const fixFocus = () => {
      let u = navigator.userAgent;
      let isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
      // 如果是IOS设备
      if (isiOS) {
        let flag = false
        let pageBackNormFunc
        // 聚焦后，键盘弹起
        document.body.addEventListener('focusin', () => {
          flag = true
          pageBackNormFunc && clearTimeout(pageBackNormFunc)
        })
        // 失焦后，键盘关闭
        document.body.addEventListener('focusout', () => {
          if (flag) {
            // 页面滚动回原来的位置
            pageBackNormFunc = setTimeout(() => {
              window.scrollTo({ top: 0, left: 0, behavior: 'smooth' })
            }, 200)
          }
          flag = false
        })
      }
    }

Android

配置在：public>index.html

注意：需要判断机型，因为不判断机型，会导致iOS出现顶部白条问题（针对个人的项目会有此问题，具体应用不同项目，需要根据自己项目而定）

 var userAgent = navigator.userAgent;
    var isAndroid = userAgent.indexOf('Android') > -1 || userAgent.indexOf('Adr') > -1; //android终端
    if (isAndroid) {
      // 安卓下软键盘影响布局
      var initViewport = function (height) {
        var metaEl = document.querySelector("#viewportMeta");
        var content = "width=device-width,initial-scale=1.0,user-scalable=no,maximum-scale=1.0,height=" + height;
        metaEl.setAttribute('name', 'viewport');
        metaEl.setAttribute('content', content);
      }
      initViewport(window.innerHeight);
    }

特别说明：每一篇文章，都是针对自己做过的项目而记下的笔记；笔记的内容也是参考网上的资料，我就是个搬运工，整合成了自己的笔记。如需要参考的，请根据自己实际项目需求参考。