- 博客(63)
- 收藏
- 关注
RSS订阅原创 node+egg搭建管理系统后台
Sequelize 是一个 Node.js 生态中最流行的 ORM（对象关系映射） 框架，主要用来简化你在 Node.js 项目中与关系型数据库（MySQL、PostgreSQL、SQLite、MSSQL 等）的交互。简单来说，它帮你用 JavaScript/TypeScript 对象 来操作数据库表，而不用直接写复杂的 SQL 语句。id: { type: BIGINT, primaryKey: true, autoIncrement: true, comment: '主键' },
2026-01-21 18:18:08
565
原创 vue3 + element plus实现表头拖拽数组进行汇总
最近在做报表的时候，需要拖拽对应的表头，根据拖拽的表头数据进行汇总， 执行来回拖拽，拖拽借用了Sortable.js这个插件来实现的。汇总通过后台查询的一维数组，拖拽一个表头根据对应的表头字段将一维数组进行分组成树形结构数据。
2026-01-04 17:40:32
699
原创 vue3 + ts 输入框对特殊字符进行颜色标识
在后台管理系统中用户输入内容需要对特殊字符进行颜色标识，这里使用到的是elementPlus，因为输入框是字符串无法做颜色标识，只能使用标签形式来做颜色标识。使用定位将渲染元素和输入框重合在一起，输入框背景透明、颜色透明，循环输入元素对每个元素进行判断，是否需要颜色标记，有的话插入一个带class标签span来处理。
2025-12-17 17:42:29
201
原创 react可视化标尺@scena/react-ruler使用
Ruler${< Ruler(value) => ` ${ value } px ` } // 刻度显示为 "50px" "100px" / >px`} // 刻度显示为 "50px" "100px"/>
2025-12-01 17:18:47
924
原创 Vue3后台管理系统通过插槽封装表单搜索展开收起
管理后台开发中搜索条件只展示2行其它的都通过展开收起控制，但是按钮只能默认在右层。这种通过插槽来实现，获取父组件的所有虚拟节点，通过h函数生成真实DOM节点，使用Component来渲染对应的节点。
2025-11-21 10:45:04
278
原创 react antdesign实现表格嵌套表单
主要实现是在每列添加对应的表单控件使用受控组件来实现 <Input value={text} onChange={(e) => handleFieldChange(e, ‘paramName’, index) } 改变当前表格数据来实现数据的改变。一直使用elementui，后期使用antDesign个人感觉封装的很死没有elementui灵活，也可能是自己不熟吧。做个表格嵌套表单弄半天了。官网地址反正我是看半天了。
2025-11-03 16:40:13
352
原创 elementPlus Virtualized Table 虚拟化表格封装成组件解决表格数据量卡顿
elementPlus 提供了Virtualized Table 虚拟化表格解决数据量大表格卡顿问题；封装成VirtualTableList 组件。
2025-10-31 10:06:53
247
原创 react使用@monaco-editor/react实现在线代码编译器
/ 获取 monaco 实例// 配置 YAML 语言（需确保已加载）validate: true, // 启用语法校验schemas: [// 可选：配置 JSON Schema 用于自动补全});
2025-10-28 16:23:06
1109
原创 vue3 封装图片上传预览组件支持docx、excel、pdf、图片、txt格式
主要是使用vue-office来实现docx和excel、pdf插件来实现预览。
2025-10-16 11:33:31
353
原创 uniapp使用音频录音功能
注意：uniapp提供的uni.getRecorderManager()在h5上面不支持，如果h5想实现录音功能使用navigator.mediaDevices.getUserMedia({ audio: true })API来实现。uniapp就支持全局状态管理功能只要文件下创建store文件。主要根据uniapp官网提供的。
2025-10-15 11:32:14
696
原创 react+andDesign+vite+ts从零搭建后台管理系统(三)-Layout布局
react+antdesign+vite+ts从零搭建后台管理系统 layout基础布局
2025-10-10 11:01:02
351
原创 react+andDesign+vite+ts从零搭建后台管理系统(一)
├─ tsconfig.json # typescript 全局配置。│ └─ vite-env.d.ts # vite 声明文件。├─ .prettierrc.js # prettier 配置。└─ vite.config.ts # vite 配置。├─ .env.test # 测试环境配置。├─ .env.dev # 开发环境配置。
2025-09-19 23:10:57
818
原创 react+antdesign实现后台管理系统面包屑
实现这个功能主要是当我点击对应目录下的子菜单使用递归获取当前叶子节点的最高父节点拿到整个对象塞到集合中去。创建 Breadcrumb组件。
2025-09-19 22:41:19
427
原创 react+anddesign组件Tabs实现后台管理系统自定义页签头
使用react和开发一个后台管理页签头。这里使用全局状态管理zustand来实现这个功能。
2025-09-19 22:33:51
377
原创 vue3 编辑状态用户改了数据没保存关闭时候给提示
用户在编辑页面修改了数据但是没点保存直接关闭需要给予提示，这个功能主要实现方案是对比两个数据的差异，如果数据有变化给予提示没有变化就不给予提示。
2025-09-12 10:04:41
202
原创 elementui表单校验未通过滚动到第一个表单元素
在开发中遇到页面很长的，页面校验很多在提交保存的时候自动滚动到对应的第一个未通过校验的元素。
2025-03-27 20:39:16
204
原创 前端项目打包构建优化
cache默认生成在node_modules/.cache/terser-plugin文件下，通过SHA或者base64编码之前的文件处理结果，并保存文件映射关系，方便下一次处理文件时可以查看之前同文件（同内容）是否有可用缓存，默认存放在内存中，可以修改将缓存存放到硬盘中。我们需要自己手动配置的事情更少了，而图片压缩处理就是其中的一件，vue项目中的图片文件过大，会导致打包体积增大，需要将大文件的图片进行压缩从而缩小打包体积。帮我们把项目中一些没有使用过的代码删除，减少项目体积的插件。
2025-03-18 00:47:30
823
原创 webpack自定义plugin
webpack.config.js配置output: {},plugins: [banner: '测试测试测试测试'})FooterPlugin文件${thisconst {const {*/`})})bundle.js文件尾部添加注释效果。
2025-03-16 16:35:20
551
原创 浏览器安全问题
中间人攻击是指攻击者与通讯的两端分别创建独立的联系，并交换其所收到的数据，使通讯的两端认为他们正在通过一个私密的连接与对方直接对话，但实际上整个会话都被攻击者完全控制，在中间人攻击中，攻击者可以拦截通讯双方的通话并插入新的内容。DOM 型 XSS 跟前两种 XSS 的区别：DOM 型 XSS 攻击中，取出和执⾏恶意代码由浏览器端完成，属于前端JavaScript ⾃身的安全漏洞，⽽其他两种 XSS 都属于服务端的安全漏洞。XSS 攻击指的是跨站脚本攻击，是一种代码注入攻击。
2025-03-07 13:57:26
584
原创 docker简介
我们希望有一个工具可以帮助我们一键智能部署，假如你要部署在多台不同的机器上，可以不用担心不同系统，不同版本的差异，以及运行之前需要安装不同软件的痛苦。当红的虚拟化软件：Dockerhttps://www.docker.comDocker的进化下载地址： https://www.docker.com/products/docker-desktop可以在https://hub.docker.com/search?q=&type=image中获取各种官方的镜像，并且可以上传你自己定义镜像Docker镜像仓库
2024-10-04 17:39:42
1576
7
原创 nodejs笔记
由于Node环境执行的javascript代码是服务器代码，所有，绝大部分需要在服务器运行期反复执行业务逻辑的代码，必须使用异步代码，否则，同步代码在执行期，服务器停止响应，因为javascript只有一个执行线程。有些流用来读取数据，比如从文件读取数据时，可以打卡一个文件流，然后从文件流中不断地读取数据，有些流用来 写入数据，比如同文件写入数据时，只需要把数据不断地往文件流中写进行就可以。执行命令nrm ls 查看可选的源，其中，带*的是当前使用的源，上面的输出表明当前源是官方源。
2024-09-05 15:31:01
1215
原创 vue3 动态组件component不生效问题
因为vue3使用的是setup语法，组件只要import导入就行 不需要再像vue2中在components挂载，这样导致我想渲染的组件是没有渲染出来页面出现空白，尝试了很多办法对应的组件里面添加多个script指定对应的组件名，还是没生效。在vue3使用component动态组件展示组件时，组件就是不展示显示空白。使用shallowReactive或者shallowRef把对应的组件名称重新定义下，遍历component时，is采用对象key获取对应的对应的组件，这样组件就显示出来了。
2024-08-28 15:04:54
1040
原创 如何将本地组件库上传到npm上
基于vue开发项目怎么把本地开发的组件发布到npm上面，我们需要去了解vue封装组件的原理，利用vue.use(plugin)这个api, 我们需要把封装好的组件打包成vue库，并提供install方法发布到npm上去，Vue.use(plugin)自动执行插件中的install方法。我们在这里主要介绍的主要是怎么把已经开发项目中的公共组件怎么打包发布到npm上面。
2024-08-16 16:46:31
970
原创 脚手架简介
主命令：vuecommand的param: vue-test-app它表示创建一个vue项目，项目的名称为vue-test-app,以上是一个较为简单的脚手架命令，但实际场景往往更加复杂，比如：这里的–force叫做option,用来辅助脚手架确定在特定场景下用户的选择(可以理解为配置)。
2024-08-15 17:52:40
853
原创 微前端概念
元素隔离的概念来自ShadowDom,即ShadowDom中的元素可以和外包的元素重复但不会冲突，micro-app模拟实现了类似ShadowDom的功能，元素不会逃离
2024-07-29 19:15:35
1195
1
原创 前端性能优化
简单来说就是你的网站够不够快打开速度动画效果表单提交列表滚动页面切换。。。MDN上的web性能定义：Web性能是网站或应用程序的客观度量和可感知的用户体验减少整体加载时间： 减少文件体积、减少HTTP请求、使用预加载使网站尽快可用：仅加载首屏内容，其它内容根据需要进行懒加载平滑和交互性：使用css替代js动画、减少UI重绘感知表现：你的页面可能不能做得更快，但你可以让用户感觉更快。耗时操作要给用户反馈，比如加载动画、进度条、骨架屏、等提示信息。
2024-07-26 15:24:46
1700
原创 React路由笔记
Switch></Switch>exact 精确匹配 (Redirect 即使使用了exact, 外面还要嵌套Switch 来用)stack,这个警告只有在hash 模式会出现。react-router ：核心模块，包含 React 路由大部分的核心功能，包括路由匹配算法和大部分核心组件和钩子。
2023-12-11 15:04:58
944
原创 react笔记
当我们想在两个函数之间共享逻辑时，我们会把它提取到第三个函数中。必须以"use"开头吗？必须如此，这个约定非常重要，不遵循的话，由于无法判断某个函数是否包含对某内部Hook的调用，React将无法自动检查你的Hook是否违反了HooK的规则。
2023-12-11 13:44:50
1282
原创 Typescript笔记
JS 已有类型原始类型，简单类型（ number/string/boolean/null/undefined ）复杂数据类型（数组，对象，函数等）TS 新增类型联合类型自定义类型（类型别名）接口元组字面量类型枚举void泛型是可以在保证类型安全前提下，让函数等与多种类型一起工作，从而实现复用，常用于：函数、接口、class 中创建一个 id 函数，传入什么数据就返回该数据本身(也就是说，参数和返回值类型相同)
2023-11-19 01:07:05
186
原创 el-tree回显 包含父节点子节点全部选中问题
在做权限的时候，提交数据会把选中与半选中的数据提交给后台，但是在回显时后台返回的数据包含父节点，导致子节点全部选中。解决方法，在回显的时候把后台返回的数据中把所有的父节点给删掉这样就能问题。a. tree 数据结构。b. 回显数据包含父节点。
2023-09-12 10:09:14
1283
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人