Vue3使用css特性transform实现可视化大屏自适应解决方案

操作：代码注释写的很详细，很容易就明白，对vue3不熟悉的小伙伴更加友好，将源码下载后拷贝进项目中，然后就可以直接将自己的大屏展示内容嵌套进去。相当于对整个可视区域进行了缩放操作，很方便快捷易懂。 自适应一直就是都是前端开发的大难题，特别是现在越来越多的项目喜欢大屏展示，今天公司给我的项目便是一个可视化大屏的项目，而且宽高只告诉了大概是4000*2000，然后使用的Vue3进行开发，网上找了一下几乎都是Vue2的解决过程，这方面Vue3的解决方法还是很少，所以小小的记录一下。 PS：对于使用transform实现可视化大屏自适应方案，需要注意在缩放过程中内容区域的图片像素是否达标，否则会出现图片缩放后模糊的情况。