@jizirui/auto-fix-vue3/dist/cjs/index.js

vue3大屏自适应容器

"use strict";var e=require("vue");function t(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{width:1920,height:1080},n=e.ref(t.width),a=e.ref(t.height),r=e.reactive({transform:"scale(1, 1)",transformOrigin:"left top"}),i=function(){n.value=1920,a.value=1080,r.transform="scale(1, 1)",r.transformOrigin="left top",function(){var e=window.innerWidth,t=window.innerHeight,i=e/t,c=n.value/a.value,o=0,s=0;c>i?(o=e,s=e/c):(s=t,o=t*c);var l=o/n.value,u=s/a.value,h=(e-o)/2/l,v=(t-s)/2/u;r.transform="scale(".concat(l,", ").concat(u,") translate(").concat(h,"px, ").concat(v,"px)")}()};return e.watchEffect((function(){i()})),window.addEventListener("resize",(function(){i()})),{canvasStyle:r,canvasWidth:n,canvasHeight:a}}var n=e.defineComponent({name:"FullScreenContainer",props:{width:{type:Number,required:!0,default:1920},height:{type:Number,required:!0,default:1080}},setup(e){const{canvasStyle:n,canvasWidth:a,canvasHeight:r}=t({width:e.width,height:e.height});return{canvasStyle:n,canvasWidth:a,canvasHeight:r}}});n.render=function(t,n,a,r,i,c){return e.openBlock(),e.createElementBlock("div",{class:"full-screen-container",style:e.normalizeStyle({width:t.canvasWidth+"px",height:t.canvasHeight+"px",...t.canvasStyle})},[e.renderSlot(t.$slots,"default")],4)},n.__file="src/components/full-screen-container/full-screen-container.vue";var a=[n],r={install:function(e){a.forEach((function(t){e.component(t.name,t)}))}};exports.AutoFix=r,exports.FullScreenContainer=n,exports.useAutoFix=t;
//# sourceMappingURL=index.js.map