随笔分类 - 常用方法封装
业务中的公共方法封装
JS判断对象是否发生变化，常用于监听页面表单是否修改并给出保存提示
摘要：本文主要封装方法，实现用户离开表单编辑页面时弹出提示框，若表单数据发生变化，则提示用户是否保存当前页面的信息，如图： 封装方法： 1 /** 2 * 比较俩个对象之间的差异，项目中多处用到监听表单数据是否改动，故封装此方法 3 * 如果数据改动，则返回新旧对象记录改动字段的新旧值 4 * 5 * b
阅读全文
vue+element表单校验封装
摘要：vue+element ui技术栈的小伙伴们，在平时项目里，特别是OA项目，会大量用到表单以及表单校验。经常会处理一些必填项，对它们是否有值的判断显得有些繁琐和臃肿，本文将封装方法，解决该问题。 最近业务中频繁增加必填项，之前的常规做法就是在提交、修改或者其他操作之前，判断必填项是否填写，做个拦截：
阅读全文
vue自定义指令防抖和节流
摘要：函数防抖和节流在平时业务中经常会用到，一般都是调用已经封装好的方法，下面介绍一种新的思路：vue自定义指令！ 下面这段代码以防抖为例，el-input标签直接写上v-debounce,传入arg参数：search和expression表达式：‘input’,1000。 seach为需要防抖的函数，'
阅读全文
前端性能优化之防抖、节流
摘要：本篇主要封装防抖、节流方法，并简述它们的使用场景： 防抖： /** * 如果短时间内触发多次同一事件，只执行一次 * @param {*} callback callback: 需要处理的回调函数 * @param {*} delay delay：期限 * @returns */ export fu
阅读全文
js数组元素为基本类型和对象的去重
摘要：常见的数组去重主要有俩方面： 由基本类型组成的数组去重 由对象组成的数组根据对象某个属性去重 基本类型去重： export function unique(array) { const arr = [] const contain = {} array.forEach(item => { if (!
阅读全文
js引用类型深拷贝、浅拷贝方法封装
摘要：引用类型的深拷贝、浅拷贝在前端领域一直是个很重要的知识点，不仅在业务中频繁使用，也是面试官们喜欢考的的知识点之一。本篇将封装引用类型的深拷贝、浅拷贝方法，并解决在封装过程中出现的问题。 一、浅拷贝 浅拷贝一般比较简单，缺点也很明显，引用类型的属性并不是真正的拷贝，而是拷贝的引用地址，改变一个当中的属
阅读全文
js获取本地时间
摘要：小伙伴们平时开发过程中，对获取到的本地时间有没有进行一些特殊的处理啊。比如页面需要展示这样的时间：2021.07.22、2021/07/22、2021-07-22等 。 下面我们封装一个方法，可以获取自定义格式的日期格式，可自定义精确到年月日时分秒哦~ 上代码： 1 /** 2 * 3 * @par
阅读全文
js树形数据结构的扁平化
摘要：前面我们封装了一维数组(具备树形结构相关属性)处理成树形结构的方法:https://www.cnblogs.com/coder--wang/p/15013664.html 接下来我们来一波反向操作，封装一个可以将树形结构的数据扁平化的方法。这种场景在业务中还是很常见的，比如一个级联选择器，有时候你需
阅读全文
js浮点数保留位数方法封装
摘要：大家在平时业务中应该经常跟小数打交道吧,有没有被小数点的保留位数问题搞得头疼啊。比如，保留一位小数，保留俩位小数，保留三位小数，向上取整、四舍五入等等。 而我最近在项目中正好遇到类似的问题：有的地方要求保留一位小数，有的地方要求保留俩位，有的地方要求四舍五入，有的地方要求向下取整。。。这些情形，总不
阅读全文
前端js重组树形结构数据方法封装
摘要：不知道大家平时工作中，有没有遇到这样一种情况：后端接口返回的数据，全都是一维的数组，都是平铺直叙式的数据，业务需求却要你实现树形结构的功能。那么，针对这种情况该怎么办呢？是跟后台好好沟通一下呢，还是沟通一下呢 :） 下面我将封装一种重组树形结构数据的方法，希望能够给大家带来一点帮助！ 1 /** 2
阅读全文
