找到的最简单的实现vue大屏开发的方式，页面按照1920px1080px正常开发，所有宽高写死，然后在大屏的页面添加如下代码：
原理是通过计算屏幕实际大小和19201080的比例，按照比例缩放页面大小。

1.在大屏的data里定义

screenWidth: null,
screenHeight: null,

2. 在大屏的mounted里定义

// 监控屏幕尺寸变化
      var bodyStyle = document.createElement("style");
      // 这里根据具体的设计稿尺寸来定
      bodyStyle.innerHTML = `body{width:1920px; height:1080px!important;}`;
      document.documentElement.firstElementChild.appendChild(bodyStyle);
      this.screenWidth = document.body.clientWidth;
      this.screenHeight = document.body.clientHeight;
      window.onresize = () => {
          return (() => {
              this.screenWidth = document.documentElement.clientWidth;
              this.screenHeight = document.documentElement.clientHeight;
          })();
      };
      document.addEventListener('keydown', (e)=>{
        if(e.code == 'F11'){
          this.screenWidth = document.documentElement.clientWidth;
          this.screenHeight = document.documentElement.clientHeight;
        }
      })

3. 在watch你监听

watch: {
    screenWidth: {
        handler: function () {
            // console.log("val", val);
            let docWidth = document.documentElement.clientWidth;
            let docHeight = document.documentElement.clientHeight;
            var designWidth = 1920, // 这里根据具体的设计稿尺寸来定
                designHeight = 1080, // 这里根据具体的设计稿尺寸来定
                widthRatio = docWidth / designWidth,
                heightRatio = docHeight / designHeight;
            document.body.style = `transform:scale(${widthRatio},${heightRatio});transform-origin:left top;overflow: hidden;`;
            // 应对浏览器全屏切换前后窗口因短暂滚动条问题出现未占满情况
            setTimeout(function () {
                var lateWidth = document.documentElement.clientWidth,
                    lateHeight = document.documentElement.clientHeight;
                if (lateWidth === docWidth) return;

                widthRatio = lateWidth / designWidth;
                heightRatio = lateHeight / designHeight;
                document.body.style =
                    "transform:scale(" +
                    widthRatio +
                    "," +
                    heightRatio +
                    ");transform-origin:left top;overflow: hidden;";
            }, 0);
        },
        immediate: true,
        deep: true,
    },
    screenHeight: {
        handler: function () {
            // console.log("val", val);
            let docWidth = document.documentElement.clientWidth;
            let docHeight = document.documentElement.clientHeight;
            var designWidth = 1920, // 这里根据具体的设计稿尺寸来定
                designHeight = 1080, // 这里根据具体的设计稿尺寸来定
                widthRatio = docWidth / designWidth,
                heightRatio = docHeight / designHeight;
            document.body.style = `transform:scale(${widthRatio},${heightRatio});transform-origin:left top;overflow: hidden;`;
            // 应对浏览器全屏切换前后窗口因短暂滚动条问题出现未占满情况
            setTimeout(function () {
                var lateWidth = document.documentElement.clientWidth,
                    lateHeight = document.documentElement.clientHeight;
                if (lateWidth === docWidth) return;

                widthRatio = lateWidth / designWidth;
                heightRatio = lateHeight / designHeight;
                document.body.style =
                    "transform:scale(" +
                    widthRatio +
                    "," +
                    heightRatio +
                    ");transform-origin:left top;overflow: hidden;";
            }, 0);
        },
        immediate: true,
        deep: true,
    },
  },