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

vue3大屏自适应容器

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