VUE PC端适配方案flexible（pc端文字自适应）

最新推荐文章于 2024-07-19 10:58:10 发布

南玖i

最新推荐文章于 2024-07-19 10:58:10 发布

阅读量2.3k

点赞数 4

分类专栏： vue

本文链接：https://blog.csdn.net/m0_49789433/article/details/117923823

版权

vue 专栏收录该内容

54 篇文章 1 订阅

订阅专栏

 npm i lib-flexible --save-dev

main.js中引入

import 'lib-flexible'

node_modules中找到文件在这里插入图片描述

修改第69行代码为下面代码（即可适配pc端口，使用的时候单位用rem）

 function refreshRem(){
        var width = docEl.getBoundingClientRect().width;
        if (width / dpr > 540) {
            width = width * dpr;
        }
        var rem = width / 10;
        docEl.style.fontSize = rem + 'px';
        flexible.rem = win.rem = rem;
    }