GitLab

原因

用户自己设置了页面内部的字体大小,因为目前自适应都是通过 rem设定，所以导致页面排版错位

解决方案

修正用户可能的字体大小调整

ios中禁止用户私自改字体大小 如微信字体调整会导致页面拉升

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

安卓下微信修正方式如下：

  created() {
    this.clockWxFontsize();
  }
  // methods
  clockWxFontsize() { // 安卓手机针对微信字体加锁，强制使用标准字体，避免页面被拉伸
    if (typeof window.WeixinJSBridge === 'object' && typeof window.WeixinJSBridge.invoke === 'function') {
      this.handleFontSize();
    } else {
      if (document.addEventListener) {
        document.addEventListener('WeixinJSBridgeReady', this.handleFontSize, false);
      } else if (document.attachEvent) {
        document.attachEvent('WeixinJSBridgeReady', this.handleFontSize);
        document.attachEvent('onWeixinJSBridgeReady', this.handleFontSize);
      }
    }
  }
  handleFontSize() {
    // 设置网页字体为默认大小
    window.WeixinJSBridge.invoke('setFontSizeCallback', { 'fontSize': 0 });
    // 重写设置网页字体大小的事件
    window.WeixinJSBridge.on('menu:setfont', function() {
      window.WeixinJSBridge.invoke('setFontSizeCallback', { 'fontSize': 0 });
    });
  }