vue rem设置

news/2024/7/24 5:21:57 标签: javascript, html5, html, css, vue.js

路径:和main.js平级的lib文件夹里

./lib/rem.js

html" title=javascript>javascript">let resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize';
let recalc = function () {
    let width = document.documentElement.clientWidth;
    if (width < 1920) {
        width = 1920;
    }
    let point = 12 / 1920;
    let FontSize = point * width;
    document.documentElement.style.fontSize = FontSize + 'px';
    window.REMFontSize = FontSize;
}

window.addEventListener(resizeEvt, recalc, false);
document.addEventListener('DOMContentLoaded', recalc, false);

在main.js 引入

html" title=javascript>javascript">import './libs/rem'

cssrem_22">在项目根目录加上 .cssrem文件,内容如下

html" title=javascript>javascript">{
  "rootFontSize": 12,
  "fixedDigits": 3
}

http://www.niftyadmin.cn/n/1367350.html

相关文章

es6 vue 判断对象是否完全一致

/**** 判断对象是否完全一致* param {*} a* param {*} b* return {*} */ const isEqual function (a, b) {if (a b) {return a ! 0 || 1 / a 1 / b;};if (a null || b null) {return a b;};var A Object.prototype.toString.call(a);var B Object.prototype.toString.c…

es6 vue 判断元素是否在数组中

/*** 判断是否在数组中&#xff0c;&#xff08;** param {*} str* param {*} _array* return {*} */ const inArray function (str, _array) {let isInArray -1;for (let i 0; i < _array.length; i) {const element _array[i];if (isEqual(element, str)) {isInArray …

vue 创建一个js类 动态绑定事件on事件off事件run事件

我们创建一个类然后继承Events 这样我们就可以使用Events 里的方法了&#xff0c;on注册事件 off销毁事件&#xff0c;run运行事件。 /*** 动态事件绑定方法* 为构造函数添加动态事件绑定和执行方法* * class Events * example* class _Event extends Events { ... }*/ class…

render函数使用案例

简单案例 这个是ivew里的table的columns写法&#xff08;代码片段&#xff09;&#xff0c;拿它举例吧。这段代码要解决的问题是性别翻译问题&#xff0c;我用了vue自定义指令对性别翻译。翻译的方法有很多种。自定义指令写法这里不赘述了。 {title: 性别,key: sex,align: cen…

vue 文件下载Blob的使用

情景描述&#xff1a; 有一个需求&#xff0c;客户上传文件&#xff0c;向服务里导入数据。客户需要使用我们特定的文件模板上传。模板需要再我们的系统上下载&#xff0c;在使用。 功能描述&#xff1a; 后端服务给我们文件流&#xff0c;我们使用blob对象文件下载到本机。 b…

vue等待几秒后执行,vue循环调用,setInterval()与setTimeout()计时器

上网查&#xff0c;说的五花八门&#xff0c;乱糟的。 setInterval()&#xff1a;他就是每隔多少秒或毫秒调用&#xff08;循环的调用&#xff09;。页面销毁方法也就失效了。 setTimeout()&#xff1a;他就是过了多少秒或毫秒调用&#xff08;调用一次&#xff09;。 // 过5…

vue数据嵌套层数未知情况下,我们怎样渲染,已经解决。

后端返回的数据是树的结构&#xff0c;这个结构嵌套的层数不一定多少层数。 咱们本文章里的内容和element&#xff0c;iview等里面的tree组件一样的。element&#xff0c;iview等里面的tree组件扩展性不好&#xff0c;不如自己写一个。来满足自己需求。 代码难度等级&#xff…

vue txt 文件下载

let json{name:小明&#xff0c;age:24,},let strData JSON.stringify(json);const T_URL window.URL.createObjectURL(new Blob([strData]));const LINK document.createElement(a);LINK.href T_URL;LINK.setAttribute(download, 用户信息);LINK.click();window.URL.revok…