接口写好了吗-CSDN博客

原创【vue3基础核心语法】简单学习vue3核心语法加elementPlus，vue3和vue2的区别，有vue2基础的看完这篇快速使用。学习笔记持续更新【详细注释】

一直用的vue2写的。一直没有接触过vue3没有机会使用工作中自己又比较懒，一直拖着没学，因为感觉学了不用，过段时间我就忘得差不多了。这次刚好公司有了这个vue3的项目，我就来学习一波，然后实战练练刚好记得牢一点。中途遇到的各种问题和我学习到的一些vue3的语法等。就在这里记录下来学习笔记。方便自己忘了来看看，一直保持更新！！路由配置 element Plus 组件默认英文全局转中文

2023-12-09 15:52:37 7514 2

原创【最全日期获取合集】js获取昨天，今天，明天，上周，本周，下周，上月，本月，下月，去年，本年，明年，上季度，本季度，下季度，向前推日期等【全覆盖，拿来即用】

js获取昨天，今天，明天，上周，本周，下周，上月，本月，下月，去年，本年，明年，上季度，本季度，下季度，向前推日期，年龄查询，星座查询，输入日期和当前日期时间差，两个日期间隔天数，输入日期的月份总天数，本月过去天数，new Date日期格式转换

2022-09-06 10:09:16 3873 1

原创【流程设计】类似钉钉的流程设计功能样式demo

对于一些审批流程，可能会用到这个功能，通过这样一层层的加下来，弄一个审批流程的数组，然后根据这个来审核是否都通过审批，这里是简单的弄一个样式的demo，功能自由发挥。

2025-01-13 10:04:57 508

原创【按钮防抖】el-button和普通按钮防抖，点击一次禁用一秒再恢复

右边普通按钮通过自定义指令控制，这里自定义指令写法是html版本的。左边是组件按钮，通过disabled控制。点击后的效果，一秒后会恢复可点击。

2025-01-13 09:37:08 275

原创【国际化I18n使用方法】vue2使用i18简单实现多语种切换，刷新保持，动态数据处理

这句话的意思就是有缓存的话拿缓存的语言类型，没有就默认用中文的，然后你就可以全局都刷新保持语言类型了。总结就是，安装好插件后，配置几个语言的js文件，每个词都要在每个js内写一遍对应的语言，然后通过切换js文件拿到对应的语言，实现翻译的效果。1，在你的语言文件内用花括号然后内部用一个变量接收，在你的也没事，调用$t 的时候，第二个参数传一个对象，里面分别是你对应括号内的名字和值就可以实现动态数据。1，你在某一个设置语言的页面切换语言，然后把切换的比如从zh切换到en。然后把en保存到本地缓存里。

2024-06-22 11:03:07 1703

原创【图片和表格数据导出excel】js把表格导出成excel格式，表格内的图片一起导出

表格样式可以在这里面调整，就是直接加在表格的标签上写样式，tr td 之类的。2，使用方法，组好表头和内容就行，图片会自动识别的。1，js代码，把这个代码复制到一个js文件内。

2024-06-12 13:28:59 678 1

原创【打印功能】js简单实现表格样式的数据打印，按样式打印出来

1，html部分：写一个表格，然后数据填进去。2，css部分：把表格样式搞一搞。3，js部分：这样复制过去就行了。4，点击打印按钮，搞定。

2024-06-06 11:23:53 714

原创【前端小技巧】各种奇奇怪怪的技巧合集

使用方法：打开控制台，在console内输入这句话按回车：document.body.contentEditable=‘true’然后你就可以编辑页面上的内容了，比如这样。

2024-03-12 08:40:20 604

原创【多个请求按顺序执行】通过async await和promise按顺序执行请求,多种方法情况集合

需要获取数据的时候就promise.all（数组）.then（）就可以拿到返回值，把请求用promise抱起来，请求成功再返回resolve。这里是通过async await和promise配合完成。实现逻辑：先定义一个空数组，然后循环把请求加到数组内，然后promise.all（数组）就自动按顺序执行了，比如循环三次，顺序应该是 A,B,A,B,A,B。你按什么顺序发送的，就会按什么顺序返回值。返回值是一个数组，是多个请求的返回值，可以通过promise.all来实现。然后用await阻断，按顺序执行。

2024-02-23 15:27:04 1721

原创【vue填空题功能双版本】js简单实现填空题功能，可勾选并输入的填空功能，完形填空，可自由控制填空位置，段落中可加多个填空，可以保存回显数据【详细注释】

在配置的地方输入内容比如：啊啊{1}啊啊{2}注意上面这个文字后面的{}，这就代表了输入框。我们拿到这个数据后，通过正则匹配到对应花括号的位置，然后把他替换成一个输入框然后输入框输入的内容在通过匹配花括号的位置来替换成答案，最终合并出了一个我们需要的数据回显也是根据括号内的数字来匹配输入框的dom实现的。具体看下面代码的注释。

2024-01-02 18:01:06 2607 2

原创【nodejs升级版本】win10 nodejs版本低升级版本流程

3,下载各个版本的node网址是这个，下载方式就是进去看那个V开头的版本号，找个你想要的版本，然后点开进去找对应你电脑系统的下载就行了，比如我是win10 我就下了下图红圈标出来的那个。1，找到你node的安装路径，不知道的可以cmd命令行中输入这个命令就可以看到了。4，找到node文件夹路径，去把里面的文件全部替换成新的文件。然后node -v 看一下，版本就更新了。2，查看node版本的命令是这个。

2023-12-10 10:46:16 3698

原创【自定义列表头】vue el-table表格自定义列显示隐藏，多级表头自定义列显示隐藏，自由搭配版本和固定列版本【注释详细】

最近遇到一个功能，需要的是把表格的列可以配置，用户可以根据自己想要看的数据来改变表头列显示哪些隐藏哪些。于是我做了两个版本。第一个版本是自由搭配的。就是提前顶号所有的列，然后自己可以拖拽到想要位置顺序。也可以自己新增一个二级表头自定义一个名称把表头都拖进去组成多级表头表格。不过这种的毕竟复杂。第二个版本就简单一些了，是固定的列，比如十列写好了，然后用户只能在这十列里面选择显示或隐藏哪些。位置不能动，文字也不能动。就是单纯的显示隐藏列。

2023-11-16 16:06:25 6718 4

原创【限制输入框值类型】自定义指令el-input输入类型限制，vue和html两个版本

经常遇到输入框需要限制只能输入数字的，因为用户很离谱，明显输入数字的地方他非要输入英文或者中文但是用到UI框架或者自己写方法验证表单比较麻烦为了一个输入框专门去弄一个验证很麻烦所以这里就整合了两种自定义指令的方式，更加方便使用vue版本和 html版本都有。1，弄一个input.js文件复制下面代码vnode.locking = true//解决中文输入双向绑定失效})vnode.locking = false//解决中文输入双向绑定失效})//输入监听处理return;

2023-11-03 11:04:16 1496

原创【数值计算汇总】js前端数值计算校验转换

这个合集功能主要是为了处理前端计算数据因为我的项目有很多表格公式计算是前端写的所以有一个很麻烦的事情就是加减乘除的时候因为各种情况导致报错最常见的就是后端传的值不规范有时候这个字段没有值的时候给我返回的是数字0，有时候字符串数字0，有时候null，有时候 ’ ’ 等等之类的不确定情况所以我就写了几个方法统一把后端的数据丢里面直接校验转换，凡是没有值的统一都转0这样计算不会报错。

2023-10-27 15:53:08 433

原创【递归汇总】前端各种递归方法记录合集

【代码】【递归汇总】前端各种递归方法记录合集。

2023-10-27 15:38:12 993

原创【排序】js简单实现前端数组排序，多字段数组对象排序，字符串排序，数字排序等

数组对象根据某一个字段排序。

2023-10-27 15:34:25 1448

原创【筛选方法汇总】js简单实现多条件过滤数组对象，返回新的数组，根据一个数组内的元素，过滤另一个数组对象【持续更新】

使用方法：filterConditions 是筛选条件，key要和筛选的数组中的key一致，如果筛选条件没有传或者传的空，会返回原数据不筛选，如果有值了会筛选。主要对比的地方在这里 p[key] == queryObj[key]如果有其他特殊需求的选项或者值需要返回原数组的就自行增删。是因为我下拉框选项中有一个全部的选项，拿到的值是0.我这里是直接对比是否一致的，如果你需要模糊查询，这里注意，返回原数组的判断条件可以自行设定，第二个参数传的是需要过滤的数组对象。需要返回所有数据，所以我加了一条，

2023-10-27 15:28:33 4488

原创【企业微信扫码登录】html网页中如何实现企业微信扫码登录功能，图文描述简单三步实现

今天做到了企业微信在网页上扫码登录的功能要求就是登录的时候可以点击企业微信的图标，然后弹出扫码登录的二维码扫描二维码登录，跳转拿到code然后把code发给后端后端根据code获取对应用户信息，然后返回给我，我登录到系统首页。

2023-10-10 14:24:28 2249 1

原创【表格插入小计行】el-table表格，数组对象中根据某字段插入小计行计算数据

功能解释：遇到的一个需求，是表格的tabledata数组。里面有科室医生还有很多消费指标等数据。然后需要我排序后把科室放在一起。然后在每个科室下面添加一行数据，是小计行。用于计算上面相同科室的所有数据汇总。然后最下面再来个合计行，加上所有的小计。

2023-09-21 09:19:53 1202 1

原创【ios日期显示Invina Date】微信小程序日期倒计时，安卓端可以显示，ios端显示null，真机调试发现new Date是Invina Date

2，日期如果后面还带上了时间，比如 2023/08/10 10:30:30这样的。如果想要写就写成23：59：59不然还是会显示Invina Date。ios端不兼容 2023-08-10这种日期格式。，不可以写24：00：00这也是不兼容的。

2023-08-18 15:10:44 313

原创【el-tree查询并高亮】vue使用el-tree组件，搜索展开并选中对应节点，高亮搜索的关键字，过滤后高亮关键字，两种方法

2，差的时候调用这个this.$refs.tree2.filter(this.title);里面的title就是你搜索的值。1，在tree标签上加上这句话:filter-node-method="filterNode"这个方法复制下面的，只需要把data.title修改成你字段的名字就行，比如你的字段叫name就是data.name。这里的逻辑就是通过递归循环把所有和关键字匹配的节点筛选出来。这个是用的官方文档的那个过滤方式，可以参考官方文档看一下。效果图这样的，会把所有的有这些关键字的节点都展开。

2023-07-22 10:20:03 4076 1

原创【html页面引入vue3语法模板】在html页面中使用vue3语法和elementul-plus组件库的简单模板

这是最近在看这些东西，因为看别的地方是用脚手架直接用的。我这个项目想要在html上直接使用。所以我就试了下如何在html上使用vue3语法目前摸索出来的是这样可以使用。记录下来供参考，如果有不好的地方后续改进。

2023-07-12 09:01:23 3284

原创【vant移动端表格数据排版】用vant2简单实现一个把PC端表格数据展示在移动端的排版。上拉加载更多，下拉刷新页面，新增，编辑，删除功能

上次做了一个移动端的表格功能，纯表格的那种。跟PC一样，但是我一直觉得在移动端上写表格很糟糕的体验，毕竟手机就那么大。这不合理。但是我这公司又需要把PC端的表格的数据展示在移动端。导致我只能去试试看怎么排版比较好。由于网上也是一直找不到什么案例参考，所以就自己想了一个排版供大家参考。如果各位有更好的排版方式请发我一个图学习一下。

2023-07-05 14:52:27 8523

原创【el-tree大量数据卡顿解决】el-tree利用懒加载解决大数据量卡顿问题，el-tree懒加载回显方法

问题是这样：我的项目中，有一个角色管理的页面。以前的老代码，直接用el-tree渲染的树形结构，勾选设置对应的权限。其他的部门倒是还好，但是涉及到老板的部门设置的时候，由于我们这边的权限太多，部门也特别多，而老板又是有很多的权限，导致我们一次需要渲染出一大堆的tree结构之外，还需要回显一大堆的勾选。这就导致别的人设置可以，但是老板设置权限的时候就会卡住几十秒，甚至卡死浏览器。所以没办法，只能动手优化一下老代码，让他快一点。这样的属性结构，有很多的层级el-tree懒加载的功能，一层一层的加载，让页面不会

2023-07-04 10:18:36 12699 17

原创【企业微信开发流程前端篇】企业微信自建应用开发流程详细介绍，js-sdk获取用户信息，快捷回复，授权，发送朋友圈功能实现【一次看懂，简单开发】

最近刚好遇到了这么个任务需要我在企业微信中内嵌一个自建应用，用于打通跟我们医院后台系统的数据对接。这样就可以直接让客服们在企业微信上点击右边页面操作后台的数据了。这可是给我踩了好多坑。毕竟从来没有做过企业微信的开发，有点懵。也是踩了好多坑后，这里写一个帖子汇总一下我经历的全流程开发当然这是基础的流程啊。因为我的功能要求也不是很高。后面如果开发更多的东西再补充。

2023-04-13 16:08:42 11005 7

原创【uniapp索引列表】移动端uniapp使用uni-indexed-list索引列表方法，增加图片头像方法，覆盖全屏解决办法

最近做到了一个移动端联系人列表功能但是不让使用移动端的ui库，只能使用uniapp的组件所以就发现了这个索引列表组件但是使用过后发现有一点问题，比如我需要头像，但是他没有自带图片功能。比如我使用过后，我自定义了导航栏但是被覆盖住了，把导航栏顶没了。这里我都一一的解决了，所以这里记录一下。完整代码直接发出来看吧问题点是：这个组件给自己的最外层盒子加了个定位，在这里所以就造成了他是脱离文档流的，然后会导致比如你再上写了其他的组件比如搜索栏，

2023-04-06 14:06:36 6290 1

原创【uniapp tabs标签组件】移动端tabs标签组件，点击标签滚动到中间位置，点击标签横向滚动显示完全【复制即用】

这个tabs功能是很多移动端项目都要用的最近我刚好遇到了这个功能因为我们项目不让用uview等组件。所以只能用uniapp自带的组件uni-ui但是问题就是这里没有这种滚动的tabs标签组件用啊。所以万不得已之下，我cv工程师只好动动小手写一个组件了。刚好这里也发出来保存一下，以后在用到可以直接复制了。

2023-03-20 10:29:55 3529 1

原创【移动端表格组件】uniapp简单实现H5，小程序，APP多端兼容表格功能，复制即用，简单易懂【详细注释版本】

由于最近需要做移动端的项目有个pc端的后台系统里面需要移一部分页面过来而里面就有很多的表格，我就开始惯例网上先找前人栽的树，我好乘凉然后找了一圈发现，不管是主流的移动端ui库或者网上自己写的帖子，或者uniapp的插件网站都没有看到符合我要求的表格，然后如果要改别人的源码那我看代码都要看很久，好切有些还奇奇怪怪的bug不兼容可能是别人使用了某些组件和插件之类的。导致我很多设置不生效。没错，我也改过别人的源码了，后来放弃了。H5，小程序兼容表格。移动端表格功能。多端兼容表格功能

2023-03-02 10:55:45 15037 11

原创【原生html使用vue混入功能】html文件引入vue语法，在html中使用vue混入功能

最近遇到的需求，需要在html页面上用vue的混入功能然后我网上找了很久没有试出来然后就自己琢磨怎么弄，没想到还真试出来了。这里就来记录一下，万一以后又遇到这情况，知道如何混入了- -！

2023-02-23 11:18:40 1944

原创【html弹框拖拽和div拖拽功能】原生html页面引入vue语法后通过自定义指令简单实现div和弹框拖拽功能

这是html版本的。只是引用了vue的语法。这是很多公司会出现的一种情况，就是原生的页面，引入vue的语法开发这就导致有些vue上很简单的功能。放到这里需要转换一下以前写过一个vue版本的帖子，现在再加一个html版本的。

2023-02-13 14:17:13 2048

原创【表格单元格可编辑】vue-elementul简单实现table表格点击单元格可编辑，点击单元格变成弹框修改数据

这是继我另一个帖子就是单元格点击变成输入框后添加的功能因为考虑到有些时候修改单元格的信息可能点击后要修改很多，那一个输入框不好用所以这时候就需要一个弹框可以把所有表单都显示出来修改所以这里就专门又写了一个demo，用于处理这种情况如果需要看表格单元格点击后变成输入框，然后焦点消失后直接更改的模板，可以点击这个帖子点击单元格变输入框。

2023-02-13 14:05:11 8756 1

原创【表格排序】vue-elementul表格简单实现排序，数组对象排序方法

像这样的，我是用的第一列ks（科室）来排列的。a b代表每一行的数据。这里是每一行是数字的话就用减号排序，ab两个变量调换一下位置就是反过来的。替换成你们自己需要的字段名就可以了。tableData代表表格数据。比如你表格想要第一列按名字排序。那么就这样，用大于小于号来排列。我这里ks就是表格中的字段名。

2023-02-07 14:01:07 745

原创【表格单元格可编辑】vue-elementul简单实现table表格点击单元格可编辑，点击单元格变成输入框修改数据

这是最近遇到的功能，经常会需要一个表格可以编辑数据类似于excel那种点击一下单元格就可以编辑数据，修改后鼠标移动出去光标消失就会保存数据给后台这里记录一下实现方法，其实也比较简单就是通过角标来判断显示隐藏的。

2023-02-02 10:18:42 8554 2

原创【html页面引入vue页面】使用httpVueLoader.js让html页面引入vue文件当组件使用，html组件化开发

最近遇到的一个需求，就是html页面需要组件化开发，然后找了一圈，发现很多组件化开发不好用一般就是几种，比较用的多的一个是iframe嵌套页面，一个就是通过js生成页面写组件。感觉都挺麻烦的。就想着有没有能像vue哪样简单的组件引入方式。而且iframe加载也慢。没有组件快。后来发现了这个httpVueLoader.js非常好用。只需要引入这个文件，然后其他使用方法和vue差不多了。稍微有点变动可能就是传值方面。传值下面也给出了方案。集中传值的方法应该大体是够用了的。

2023-01-16 09:18:48 6733 2

原创【多个IP地址用逗号分割开】vue简单实现，textarea文本域输入多个ip地址用逗号分隔开，根据空格分割

这个功能也是很多地方会用到的。一般使用的地方是比如需要设置白名单或者黑名单然后页面上会有一个textarea文本域。在文本域中输入多个ip地址，输入一个回车换一行。然后点击保存后，把数据通过逗号隔开的格式传给后端后端再去拿到每一个ip地址做一定的操作所以这里记录一下逗号分割的方法因为我在网上找了很久，看到基本写的都不是我要的。

2022-12-23 10:59:42 1624

原创【表格合并与底纹】vue-elementul表格简单实现合并单元格，与列和行给底纹颜色

这是一个很常见的需求啊，因为很多公司都会涉及到写表格展示数据那么在某些公司内就会出现为了让数据更直观的感受到而让你给某些行和列用颜色标出来。使得看起来更方便那么这里就汇总一下常用的横竖合并以及横竖颜色底纹如何实现。

2022-12-23 09:49:49 1274

原创【iconfont图标】vue引入并使用阿里巴巴iconfont图标流程【uniapp引入iconfont真机APP不显示问题解决，移动端引入报错解决】

为什么要使用阿里图标库：图标现在是很多地方都会用到的一般我使用的时候都是直接在ui库中比如elementul自带的一些有时候哪怕是感觉图标不是非常适合也是用的elementul图标，主要原因是懒因为能直接复制的，就懒得再去阿里图标库下载遍，差不多就行了。但是总有些时候你需要的图标是真的在elementul里没有的或者完全不适合的。这时候我们需要去到阿里的图标库里找找，这里的图标非常多，完全可以满足一切需求了。1，Unicode：兼容性好，ie低版本也好用，可以和文字一样调整颜色和大小。缺点是不显

2022-11-28 10:06:45 5222 1

原创【微信小程序支付功能】uniapp实现微信小程序支付功能

如果出现了调用不起来的，没反应的，看一下uni.requestPayment内的参数是否错误。前端在这个请求的成功内继续调用微信的方法uni.requestPayment。然后就是正常的支付了。把后端传给你的6个参数按我这样写上去，就可以调用起微信的支付功能了。然后先请求后端的一个方法，把你的价格还有openid之类的传给后端。点击按钮后触发支付方法，就是我下面写的这些代码，复制就可以了。如果你是手机上测试，就是直接掉起支付，跟上面的图一样。首先前端写一个页面，简单说就是有一个输入支付金额的。

2022-11-01 10:10:46 2935 2

原创【H5微信授权】简单实现H5页面微信授权功能，微信开发者工具报错系统错误，错误码-1，undefined解决办法【详细】

微信开发者工具报错系统错误，错误码-1，undefined最近写到了H5公众号，需要微信授权的功能。这里记录一下授权的流程和踩了个坑。

2022-10-27 14:13:37 8577

原创【小程序websocket前后端交互】uniapp写微信小程序聊天功能功能，websocket交互功能，心跳重连【详细注释，复制即用】

这几天在做的一个需求，就是要写一个小程序端的页面，用于跟客服聊天。然后就用到了websocket技术，以前我做过网页版的，但是做小程序后发现网页版的逻辑放过来没问题，但是很多的方法和api是不生效的，所以又查文档专门看了一下对于的api，踩了一些坑后来记录一下，方便下次复制！1，页面信息展示，根据后台返回字段，分左边和右边展示2，输入后点击发送按钮，可以发送消息，通过websocket传给后台3，进入页面后链接websocket。

2022-10-25 15:25:14 8061 4

html2canvas.js 和 jspdf.debug.js

html2canvas.js 和 jspdf.debug.js html页面转pdf格式下载，原生js纯html转pdf资源

2022-10-18

前端html本地使用vue-axios-elementul资源框架，下载即用，附带富文本编辑器本地资源

前端html本地使用vue-axios-elementul资源框架，下载即用，附带富文本编辑器本地资源有时候需要一个html文件写个小项目，这时候我们为了保证稳定，会不采用cdn引入，而是本地下载资源引入，这里提供一个模板，可以直接下载后使用。引入好了vue-axios-elementul还有富文本编辑器的资源也引入了。详细注释了，方便使用。可以直接下载就可以再模板里写你的页面，和vue一模一样写法。功能目录：已引入 vue axios elementul 富文本编辑器

2022-09-30

安装jdk时遇到当前页面脚本错误的报错，下载这个版本的jdk解决

官网下的，然后根据教程来安装的，但是到最后一步的时候就会出现当前页面脚本错误的提示，如果点了是就会一直卡住没反应了报错信息是缺少‘）’

2022-04-08

Tinymce富文本编辑器文件资源，下载直接放到项目中就能用

配套使用贴【富文本编辑器功能】vue实现富文本编辑器Tinymce功能，保留编辑器格式文章展示在页面上【前后端代码展示，简单好用】 https://blog.csdn.net/seeeeeeeeeee/article/details/123902423

2022-04-08

【大屏可视化模板】vue-dataV-echarts-elementul大屏数据可视化方案，屏幕适配方案等比例缩放

用了vue - echarts - datav-elementul大屏数据可视化方案，包含屏幕适配方案等比例缩放，等比例缩放的屏幕适配方法。可以让你不需要大量使用百分比或者转换之类的方法去写屏幕自适应大小，而是可以用部分px直接写css定死，通过屏幕大小改变对应等比例缩放，达到屏幕适配效果为了让大家直观的看到所有的代码，所以结构方法等就不分各个组件引入了，会很麻烦要找哪是哪，我直接把所有的图都写在了一个vue组件内。并配上注释，相信大家可以很容易找到哪里对应哪里区域

2022-04-08