57 lines
1.2 KiB
Vue
57 lines
1.2 KiB
Vue
<template>
|
||
<div id="app">
|
||
<router-view/>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
ThemeColor
|
||
} from './ThemeColor'
|
||
import {reqGetTestData} from "@/api";
|
||
import './pages/css/reset.css'
|
||
export default {
|
||
name: 'App',
|
||
components: {},
|
||
mounted() {
|
||
this.setRemUnit()
|
||
this.initHammer()
|
||
},
|
||
methods: {
|
||
setRemUnit() {
|
||
const rem = 75; // 设置基准字体大小（默认为16px）
|
||
const screenWidth = window.innerWidth;
|
||
const designWidth = 1920; // 设置设计稿的宽度，假设为PC端设计稿的宽度
|
||
|
||
// 计算当前屏幕相对于设计稿的缩放比例
|
||
const scale = screenWidth / designWidth;
|
||
|
||
// 计算并设置根元素的字体大小（rem单位）
|
||
document.documentElement.style.fontSize = rem * Math.min(scale, 2) + 'px';
|
||
|
||
},
|
||
// const key = computed(() => {
|
||
// return route.path + Math.random();
|
||
// });
|
||
initHammer() {
|
||
const el = document.getElementById('app');
|
||
const mc = new Hammer.Manager(el);
|
||
|
||
// 添加缩放手势
|
||
mc.add(new Hammer.Pinch());
|
||
|
||
// 监听缩放手势的事件
|
||
mc.on("pinch", (event) => {
|
||
this.handlePinch(event.scale);
|
||
});
|
||
},
|
||
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style>
|
||
#app{
|
||
width: 100%;
|
||
}
|
||
</style> |