- 博客(41)
- 收藏
- 关注
RSS订阅原创 ES6——数组扩展之Set数组
[...new Set()] 是一种在JavaScript中用于去重和展开集合的操作。具体来说，new Set() 创建一个新的 Set 对象，该对象存储的元素是唯一的，不会出现重复的值。通过使用扩展运算符（...），可以将 Set 对象中的元素展开成数组形式。
2025-06-06 17:38:32
514
原创 ES6——对象扩展之Set对象
ES6的Set对象用于存储唯一值，提供多种操作方法：add()添加元素（重复则不添加），delete()删除元素，has()检查存在性，clear()清空集合，size属性获取元素数量，forEach()遍历元素。示例展示了这些方法的用法，如创建集合、增删查操作以及遍历输出。Set对象为处理唯一值集合提供了简洁高效的解决方案。
2025-06-06 17:14:40
358
原创 js 比较两个对象的值,不相等就push对象的key
本文介绍了三种在JavaScript中比较对象值并找出差异key的方法：1) 通过JSON.stringify和简单遍历处理基本对象；2) 递归方法深度比较嵌套对象，并标记差异路径；3) 使用lodash库的isEqual和omitBy函数。方法适用于不同场景，从简单键值对到复杂嵌套结构。开发时可根据对象复杂度、是否允许使用第三方库等因素选择合适方案，其中递归方法能最精确地处理深度嵌套对象的差异检测。
2025-06-05 15:07:14
441
原创 js 比较两个对象的值是否相等
JavaScript对象比较方法摘要：对象直接比较(==/===)只能判断引用相等。值相等需属性比较：1)浅比较只检查顶层属性；2)深比较用递归处理嵌套对象；3)推荐使用lodash的isEqual函数处理复杂结构。浅比较适合简单对象，深比较确保嵌套属性正确对比，第三方库提供最完整解决方案。
2025-06-05 14:59:59
199
原创 js 字符串中的特殊字符全部替换成定义对象里面key对应的value值（进阶篇）
js 字符串中的特殊字符全部替换成定义对象里面key对应的value值
2025-05-12 16:07:09
364
原创 js 字符串中的特殊字符全部替换成定义对象里面key对应的value值（基础篇）
在JavaScript中，如果想要将字符串中的特殊字符替换成对象key对应的value，你可以使用String.prototype.replace()方法配合正则表达式来实现。这种方法非常灵活，可以让你定义一个查找模式（通常是特殊字符或字符串片段），然后提供一个函数或字符串来替换这些模式。
2025-05-12 14:27:23
229
原创 VUE el-select下拉框动态设置禁用，删除后恢复可选择
点击新增添加按钮，列表table会新增一条包含下拉菜单的数据，如果其中任何一个下拉框选择了某个值，那么新增的下拉菜单的选项中该值是禁用状态，只能选择其他未被选中过的值。点击删除按钮后，已禁用的选项放开，可再次选择。
2025-05-09 15:52:03
571
原创 js 两个数组中的指定参数（id）相同，为某个对象设置disabled属性
在JavaScript中，比较两个数组并根据它们的id属性设置某个对象的disabled属性为true，有几种常用方法。方法1：使用forEach和some遍历数组并检查id是否存在。方法2：使用Set存储id以提高查找效率。方法3：使用findIndex提高代码可读性，尽管性能可能不如前两种方法。方法4：使用filter和map组合，创建新数组并标记符合条件的对象。选择哪种方法取决于具体需求和性能考虑，通常使用Set或Map的方法最为高效和清晰。
2025-05-09 14:48:54
252
原创 Element-UI Message Box 使用$msgbox方法自定义模版内容，修改默认样式
Element-UI Message Box 使用$msgbox方法自定义模版内容，修改默认样式
2025-04-23 17:06:41
421
原创 VUE Element-ui Message 消息提示组件自定义封装
为了让message信息提示的更加方便快捷，减少不同地方的调用，避免代码的重复，特意再官方message组件的基础上二次封装，使代码更加的优雅和高效。
2025-04-23 16:00:18
352
原创 JS 浅析正则表达式
做数据的校验，就离不开正则表达式，现在网上常用的正则表达式都很全，很多都是开箱即用，非常方便和快捷，但是偶尔也会遇到那种很特殊的正则校验，如果能清楚的明白正则的校验规则，那么任何时候，面对任何需求，我们都会很轻松，从容而又优雅的写出所匹配的正则表达式，从此告别盲目的搜索！
2025-04-22 10:48:21
311
原创 Vue v-for 循环DOM 指定dom个数展示一行
这些方法都可以实现基于v-for循环的DOM元素按特定规则分行显示的效果。选择最适合你需求的方法。
2025-04-21 15:51:54
259
原创 js 两个数组中的指定参数（id）是否重复
在JavaScript中，如果想检查两个数组中的id或者其他指定的参数是否重复，有几种方法可以实现。这里已id作为指定参数，以下是几种常用的方法： 方法2：使用forEach和includes 方法3：使用Map（如果需要跟踪重复的对象） 方法4：使用reduce和Set（更简洁） 经常使用，所以记录一下~
2025-04-21 15:37:08
401
原创 ES6 Object.values 特定字段处理
以上方法可以根据具体需求选择使用。如果只需要几个特定的字段，直接通过属性访问或者使用reduce方法可能是最直接和高效的方式。如果需要更灵活的处理（例如，基于某些条件选择字段），那么使用filter或结合map的方法可能更合适。
2025-04-18 10:32:26
883
原创 ES6 Object.keys()、Object.values()、 和 Object.entries() 区别
返回对象的属性名数组。返回对象的属性值数组。返回对象的键值对数组，每个键值对都是一个包含两个元素的数组。这三个方法在处理对象时都非常有用，特别是在你需要遍历对象的属性或值，或者需要将对象的属性或值转换为数组时。
2025-04-18 10:13:52
396
原创 Vue el-from的el-form-item v-for循环表单如何校验rules（二）
v-for循环对象的时候，是可以获得三个参数的，其中第一个参数是对象每一项的value值，第二个参数是每一项的key值，第三个参数是索引值，这里使用:prop="key+'.对应的key'"即可（不要漏了单引号里面的点）。循环对象的话是可以获得两个参数，其中第一个是数组的每一项，第二个参数是数组的下标，其实和对象是差不多的，v-for="(item,index) in array" , :prop="`array[${index}].name`"
2025-04-16 11:16:49
718
原创 Vue el-from的el-form-item v-for循环表单如何校验rules（一）
实际业务需求场景： 新增或编辑页面（基础信息表单，一个数据列表的表单），数据列表里面的表单数是动态添加的。数据可新增、可删除，在表单保存前，常常需要做表单必填项的校验，校验通过以后才去发请求保存表单数据。
2025-04-15 13:31:40
574
原创 Vue 解决 Error: please transfer a valid prop path to form item!
在 Vue.js 中使用表单验证库（如 VeeValidate 或 Element UI 的表单组件时），遇到错误信息 "please transfer a valid prop path to form item!" 通常指的是在表单项的属性绑定中，路径（prop path）不正确或者未正确传递。这种问题通常出现在表单验证规则的设置或者表单项的绑定上。
2025-04-14 14:13:28
870
原创 Vue表单组件el-form校验规则rules，条件判断rules表单验证显示必填或非必填
在使用 Element UI（一个基于 Vue 的前端框架）的表单验证功能时，你可能想要实现一个规则，使得某些字段在特定条件下成为必填项，或者在满足某些条件时不允许为空。这通常通过自定义校验规则来实现。
2025-04-14 13:48:04
895
原创 Vue ‘v-model‘ directives require the attribute value which is valid as LHS.
在上述代码中，我们将计算属性改为普通函数，并且在调用时传入了 item 数据。这样就能够正常获取到 item 数据，并根据 item.checked 的值来返回选中状态了。
2025-04-11 11:22:49
590
原创 element el-transfer穿梭框的重写，自定义穿梭框组件封装
通过element官方文档可以了解到 el-transfer穿梭框的基本使用方法，但是在实际业务需求中，官方组件已经无法满足产品设计和业务实际使用需求，官方提供的方法有限，无法满足各种定制化需求，今天就来封装一个Transfer 穿梭框组件，支持全流域自定义，方便、快捷、高效，开箱即用，满足各种业务场景及需求。
2025-04-03 15:30:38
456
原创 element el-transfer穿梭框的使用，自定义穿梭框的数据项（一）
el-transfer穿梭框的基本使用方法，本文主要介绍数据项的自定义渲染和右侧列表元素变化时触发方法的实现。自定义数据项，除了基本的el-transfer使用方法，还需要使用Scoped Slot。当然，如果希望在初始状态时目标列表不为空，可以像本例一样为。表示该项数据是否禁止转移。目标列表中的数据项会同步到绑定至。Transfer 的数据通过。绑定的变量赋予一个初始值。的变量，值为数据项的。为数据的唯一性标识，
2025-04-03 14:45:11
631
原创 JS获取屏幕缩放比例与分辨率，VUE
分辨率的高：window.screen.height*this.getDevicePixelRatio()/100 //乘以缩放比例为真实的像素。分辨率的宽：window.screen.width*this.getDevicePixelRatio()/100 //乘以缩放比例为真实的像素。屏幕可用工作区的高度：window.screen.availHeight;屏幕可用工作区的宽度：window.screen.availWidth;
2024-10-30 17:48:52
719
1
原创 Element el-form 表单校验，保存或提交验证某一项或者多项；validateField 的使用
业务场景：下图点击保存按钮时，只需要校验前两项，其余参数不做校验，保存为草稿；点击提交按钮时，表单里面所有的必填项需要校验。我们也可以动态更改rules规则里面的required字段，但这样点击保存时页面上的必填校验。这个方法接受两个参数，第一参数为数组或者字符串，第二个参数为回调函数。用户体验会非常不友好。其实还有很多方式可以实现，可以评论区探讨一下~如果需要对表单里的特定几个必填项进行校验，应该如何实现？如果要校验某一项，第一个参数传。
2024-08-06 17:26:24
1394
原创 error: ‘xxxx‘ is already defined (no-redeclare) at src\views\xxxx\xxxx.vue:347:1
在同一文件或者方法内声明了同样的变量，
2024-07-24 13:46:15
625
原创 Element-UI使用el-upload组件第二次上传无效问题，文件回显添加文件到elupload组件
Element-UI使用el-upload组件第二次上传无效问题，文件回显添加文件到elupload组件
2024-07-16 16:08:01
2750
原创 Element-UI Message Box 使用$prompt方法自定义模版内容，修改默认样式
data() {return {row,rule: {message: '请输入备注',},],},model: {},},
2024-06-25 14:42:26
2306
原创 Yarn 命令安装包时yarn add/install/build... 报“certificate has expired”
我们可以将 'strict-ssl' 设置为 false，从而跳过 https的验证。看了yarn的官网，估计是最近yarn官方更新引起的问题，cnpm如果出现这样的问题，大概率原因相同；2、使用命令yarn config set strict-ssl false将其改为 false。如果项目是通过Jenkins部署，可以在服务器上修改配置，用上面同样的方法，就可以解决了！3、再次执行yarn命令安装插件 ，就不会报错了，问题完美解决~~”了，非常诧异，前几天还是好的，突然就不行了。
2024-01-26 15:10:36
1704
4
原创 Vue实时监听内容超过指定行数后展开收起功能
问题描述想要实现内容超过一行的时候显示展开按钮，如果没超过一行就不显示，展开显示所有数据窗口正常大小的时候：逻辑思路：假设展示区域每行高度为30px，当内容超出一行高度30px时需要显示展开/收起按钮并实现功能。关键部分【max-height:'---px’】,只显示一行内容。给展示区域动态绑定样式max-height样式，initialListHeight,为一行的高度，也可根据现实行数，动态赋值。
2024-01-25 11:21:50
1223
原创 Element-ui中封装el-table 组件中使用表格自定义Render函数
类型:{String | Object | Function} 一个 HTML 标签名、一个组件、一个异步组件、或一个函数式组件。类型：{String | Array | Object} children 虚拟子节点(vnodes),当前html标签的元素。如果想对其中一项加上额外的状态，并添加事件、样式，该怎么做呢，就需要使用Render函数去实现。2、vue中render函数使用attrs绑定id、class、style、事件。1、项目中封装好了table组件，需要使用的地方直接引用组件就好了。
2024-01-10 13:54:47
2287
原创 js实现获取当前月份往前12个月份，接口返回缺少的月份自动补全12个月，格式化后重新渲染Echarts图表
1、日常开发中经常会有Echarts图表渲染近期12个月的数据，但是后端接口返回数据是错乱无序的数据，就需要前端单独做处理。就拿到了完整的近12个月数据，核心方法再上面封装的的方法里面，封装完成后后续直接调用就可以，最终图表显示如下；而我们想要的是正序排序，并且随机补全当前月份往前12个月缺少的月份，比如（当前是12月）：这种格式。
2023-12-26 16:15:57
987
原创 ElementUI修改el-tab-pane自定义添加class并修改组件样式
element官方文档并没有提供插槽，业务上有很多个性化需求，完成需求后记录一下，有需要的小伙伴可以直接复制代码使用。先上效果图：需求是当前用户绑定多个标签，那么默认选中第一个标签，其余所属标签字体颜色标记成黄色。vue解决方案：原生js动态添加class setAttribute。
2023-12-21 14:41:06
3449
Echarts 世界地图和主要国家的 JSON 文件
2023-12-22
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人