vue H5页面在微信中打开，调节字体大小，页面样式错乱

在vue H5项目中，在微信中打开，由于微信自带的调整字体 大小功能， 如果把字体调大， 页面样式就会出现偏差或错乱

解决方法： 在App.vue 中

IOS： 添加样式

body {
  -webkit-text-size-adjust: 100% !important;
}

安卓： js

<script>
  //解决android下显示的问题 同样 在app.vue 中也写下面这行自运行函数 写入script 里面即可
  (function () {
    if (
      typeof WeixinJSBridge == "object" &&
      typeof WeixinJSBridge.invoke == "function"
    ) {
      handleFontSize();
    } else {
      if (document.addEventListener) {
        document.addEventListener("WeixinJSBridgeReady", handleFontSize, false);
      } else if (document.attachEvent) {
        document.attachEvent("WeixinJSBridgeReady", handleFontSize);
        document.attachEvent("onWeixinJSBridgeReady", handleFontSize);
      }
    }
    function handleFontSize() {
      // 设置网页字体为默认大小
      WeixinJSBridge.invoke("setFontSizeCallback", { fontSize: 0 });
      // 重写设置网页字体大小的事件
      WeixinJSBridge.on("menu:setfont", function () {
        WeixinJSBridge.invoke("setFontSizeCallback", { fontSize: 0 });
      });
    }
  })()
</script>

本文参考于：https://blog.csdn.net/qq_37732761/article/details/114693609