问题:大屏分辨率适配繁多,目前我认为最简单且问题最少的的方案就是使用v-scale-screen插件,无需考虑单位转换,position定位也正常使用。
1. 安装
npm install v-scale-screen -save
2. vue3中使用
<template>
<v-scale-screen :width="clientWidth" :height="clientHeight" :fullScreen="true">
<div id="app">
<router-view></router-view>
</div>
</v-scale-screen>
</template>
<script>
import VScaleScreen from 'v-scale-screen'
export default {
name: 'App',
components: {
VScaleScreen
},
data() {
return {
clientWidth: 1920,
clientHeight: 1080,
};
},
}
</script>