new Vue({
router,
store,
render: h => h(App),
created () {
// 实例创建完成后被立即调用rem换算方法,解决内容闪现问题
setRemPc();
window.addEventListener('resize', setRemPc);//浏览器窗口大小改变时调用rem换算方法
}
}).$mount('#app')
//rem计算
function setRemPc () {
var whdef = 30 / 1920;// 表示1920的设计图,使用100PX的默认值
var bodyWidth = document.body.clientWidth;// 当前窗口的宽度
var rem = bodyWidth * whdef;// 以默认比例值乘以当前窗口宽度,得到该宽度下的相应FONT-SIZE值
document.getElementsByTagName('html')[0].style.fontSize = rem + 'px';
}
vue中使用rem的方式之一
最新推荐文章于 2023-03-03 16:01:57 发布