盼星星盼太阳

摘要： 一、问题引入 场景：el-draw抽屉高度（宽度）可拖拽 二、解决方案 使用vue指令，el-draw打开后，插入一个元素，绑定鼠标事件实现拖拽 主要代码如下 /** * el-drawer 拖拽高度指令 */ Vue.directive('el-drawer-drag-height', { bin 阅读全文

摘要： 一、问题引入： 可视化数据大屏需要适配各种大屏尺寸 1080P：1920*1080 2K：2560*1440 左右 4K：3840*2160 左右 8K：7680*4320 左右 二、适配方案分析 如果想简单，客户能同意留白，选用 scale 即可 如果需要兼容不同比例的大屏，并且想在不同比例中都有 阅读全文

摘要： 一、JavaScript中的Error JavaScript中，Error是一个构造函数，通过它创建一个错误对象。当运行时错误产生时，Error的实例对象会被抛出。构造一个Error的语法如下： // message: 错误描述 // fileName: 可选。被创建的Error对象的fileNam 阅读全文

摘要： 一、问题引入 Promise 在前端中的使用已经非常普遍了，但是许多开发者或许习惯了链式调用却忘了捕获 Promise 的错误了。 例如： function forgetCatchError () { async() .then(() => { // code.. }) .then(() => co 阅读全文

摘要： 一、HTML方向 调用系统功能 使用<a>能快速调用移动设备的电话/短信/邮件三大通讯功能，使用<input>能快速调用移动设备的的图库/文件。 这些功能方便了页面与系统的交互，关键在于调用格式一定要准确，否则会被移动端浏览器忽略。 <!-- 拨打电话 --> <a href="tel:10086" 阅读全文

摘要： 通用的 CSS 命名惯例 在参与规模庞大、历时漫长、且参与人数众多的项目时，要确保每一行代码都像是同一个人编写的；这就要求所有开发者，都遵守相同的代码规范。在先前的文章前端项目开发规范意见，从宏观角度，对前端开发提出了些许建议。本问就 “CSS 命名“这一普遍性难题，做下探讨。 通用规则 保持 CS 阅读全文

摘要： 工具配置 各项配置 显而易见，工具能辅助人发现很多潜在问题；非常必要引入依赖：husky、lint-staged、eslint、prettier，使得可以从流程上，保证项目的代码风格统一，规避部分错误，且不造成冲突；具体配置，可参考如下代码： "scripts": { "watcher": "onc 阅读全文

摘要： 一、问题引入 父组件监听到子组件的生命周期 二、$emit手动触发 // Parent.vue <Child @mounted="doSomething"/> // Child.vue mounted() { this.$emit("mounted"); } 三、@hook钩子 // Parent. 阅读全文

摘要： 一、问题引入 当用户发起一个请求时，判断token是否已过期，若已过期则先调refreshToken接口，拿到新的token后再继续执行之前的请求。 难点：当同时发起多个请求，token 过期会调用多次更新 token 接口；此时刷新token的接口还没返回，此时其他请求该如何处理，在刷新token 阅读全文

摘要： 话不多说，这里记录一些常见的设计模式，常看常新，也能提升JavaScript编程水平 一、设计原则 二、单例模式 单例模式的定义是,保证一个类仅有一个实例,并且要提供访问他的全局api 单例模式在前端是一种很常见的模式,一些对象我们往往就只需要一个,如VueX,React-redux等框架全局状态管 阅读全文