- 博客(74)
- 收藏
- 关注
RSS订阅原创 在uniapp中封装echarts柱状图表
感谢大家的点赞和转发。试用期指导，项目开发，简历优化，毕业设计/论文，欢迎添加本人微 信。 新人作者，欢迎关注和收藏👏🏻👏🏻 感谢大家的点赞和转发。试用期指导，项目开发，简历优化，毕业设计/论文，欢迎添加本人微 信。 新人作者，欢迎关注和收藏👏🏻👏🏻
2025-05-16 15:04:53
130
原创 ECharts 提示框组件Tooltip属性
感谢大家的点赞和转发。试用期指导，项目开发，简历优化，毕业设计/论文，欢迎添加本人微 信。 新人作者，欢迎关注和收藏👏🏻👏🏻 感谢大家的点赞和转发。试用期指导，项目开发，简历优化，毕业设计/论文，欢迎添加本人微 信。 新人作者，欢迎关注和收藏👏🏻👏🏻
2025-05-16 14:58:52
193
原创 vue3封装图片预览组件-支持滚轮放大缩小
该图片查看器组件是一个基于 Vue 开发的图片展示工具，允许用户对图片进行缩放和拖拽操作。组件提供了灵活的配置选项，如初始缩放比例、最大缩放比例、缩放步长等，同时支持根据图片高度自适应容器大小。
2025-05-13 17:38:07
904
原创 vue封装扫描线组件
感谢大家的点赞和转发。试用期指导，项目开发，简历优化，毕业设计/论文，欢迎添加本人微 信。 新人作者，欢迎关注和收藏👏🏻👏🏻3.文档 这个扫描线组件为您的界面提供了一个视觉上吸引人的扫描动画效果，常用于安全扫描、数据加载或强调特定区域的场景。组件支持循环扫描和单向扫描模式，并提供了丰富的自定义选项。vue属性说明 属性名 类型 默认值 描述 扫描线高度，支持数字 (px) 或字符串 (如
2025-05-13 09:59:26
541
原创 手动触发el-upload
所有的上传文件都是基于input实现的，所以只需要找到el-upload组件中的input触发它的click事件即可。
2025-05-09 11:53:09
290
原创 Element-ui Table tree 结构使用（解决无展开箭头）
官方示例中，有：:tree-props=“{children: ‘children’, hasChildren: ‘hasChildren’}” 绑定的属性。不是懒加载情况下，不需要 hasChildren（绑定的 table 数据中不能有，否则不能显示）【我自己就栽在这一条】不是懒加载下，children 字段一致， tree-props 可以省略，只需要 row-key 即可。从源码中看，treeProps 是有默认值的，一样时不用传，rowKey 没有所以一定需要传。上面这个是正常的使用。
2025-05-08 11:21:44
515
原创 使用原生button封装一个通用按钮组件
文档DsButton 按钮组件一个自定义按钮组件，提供多种样式类型和状态，适用于系统中的各种交互场景。禁用状态带图标的按钮自定义背景色和边框自定义尺寸宽高自适应自定义内边距使用插槽除了使用text属性设置按钮内容外，还可以使用默认插槽：样式定制按钮具有四种基本类型，每种类型有不同的样式：default: 绿色背景，白色文字dark: 半透明背景，绿色文字plain: 透明背景，绿色文字link: 透明背景，绿色文字，无边框和内边距除了预设的四种类型，还可以通过以下属性自定
2025-04-17 14:29:15
851
原创 uniapp实现H5页面麦克风权限获取与录音功能
在获取了麦克风权限后，我们可以利用navigator.mediaDevices.getUserMedia接口获取音频流，然后通过MediaRecorder接口进行录音。接下来，我们编写JavaScript代码，分别实现将音频流转换为Blob文件并上传、将音频流转换为Base64字符串上传，以及将音频文件下载到本地的功能。在uni-app开发H5页面时，需要在manifest.json文件中添加录音权限的配置。这段配置代码是用于向用户请求麦克风权限，确保应用在运行时可以访问设备的音频输入。
2025-04-10 22:55:08
1370
3
原创 elemenPlus中，如何去掉el-input中 文本域 textarea自带的边框和角标
el-input:style="{}"placeholder="请输入"/>
2025-04-10 11:38:16
937
原创 记录element-plus控件在chrome86内核下打不开的bug
因为在vite打包后发modal弹窗组件属性top:0,left:0,right:0,bottom:0都转换成了inset:0，由于浏览器版本过低，不支持该属性导致弹窗位置偏移不出现，如何配置能够避免这种情况。将cssTarget配置到兼容chrome83版本以上。在vite.config.js中配置build属性。
2025-04-09 18:27:17
161
原创 基于element-puls二次封装的图片上传组件
>if (!isJPG) {ElMessage.error('上传图片只能是JPG格式!');console.log('自定义上传成功回调', response);ElMessage.success('图片上传成功！');</script>tip="点击上传自定义图标"/>tip="使用自定义上传接口"/>'X-Custom-Header': '自定义请求头'</script>
2025-04-09 16:42:30
752
原创 vditor图片上传和图片回显功能具体实现
配置option中的upload项upload: {accept: "image/*", // 图片类型// 过滤特殊字符},// 图片上传校验，可以校验图片大小及类型if (!isLt2M) {message("上传图片大小不能超过 20MB!if (!message("仅支持上传图片！},let res;// 文本编辑器中插入图片return "上传成功";return "上传失败";},},
2025-04-07 14:35:09
314
原创 vue3实现markdown工具栏的点击事件监听
toolbar: [tip: '全屏',click() {console.log('全屏状态:', vditor.vditor.element.classList.contains('vditor--fullscreen'));});
2025-04-07 11:17:40
664
原创 Immutable.js 完全指南：不可变数据的艺术与实践
不可变数据（Immutable Data）是指一旦创建就不能被更改的数据。任何修改操作都会返回一个新的数据副本，而原始数据保持不变。这与 JavaScript 中原生的可变对象和数组形成鲜明对比。// 原生 JavaScript 的可变性// 修改原数组// 不可变数据的方式// 创建新数组// [1, 2, 3] (保持不变)// false// true。
2025-04-06 20:00:46
1211
原创 vue3实现markdown预览和编辑
Vditor是一款浏览器端的Markdown编辑器，支持所见即所得（WYSIWYG）、即时渲染（IR）和分屏预览模式。它具有以下特点：支持三种编辑模式：WYSIWYG、IR和SV内置流程图、甘特图、时序图等图表支持数学公式、音视频、代码高亮等丰富功能高度可定制化的主题和工具栏官网Vditor - 一款浏览器端的 Markdown 编辑器，支持所见即所得（富文本）、即时渲染（类似 Typora）和分屏预览模式 (b3log.org)Vditor允许完全自定义工具栏配置。toolbar: [
2025-04-05 22:43:33
1764
原创 java-6验证码校验
SysUserServiceImpl类中的redis实例的key和value类型必须声明的和ValidateCodeServiceImpl类中一样。否则无法通过redisTemplate.opsForValue().get获取值，值永远为null。应该将校验验证码放在校验账号和密码之前，可以减少数据库操作，提高性能。3.如果为空或者不一致，提示用户校验失败（不区分大小写）在login方法中添加校验图片验证码的流程。1.获取图片验证码在redis中的key。4.如果一致删除redis中的验证码。
2024-12-20 15:17:53
201
原创 java-5图片验证码
/图片验证码生成方法@Service@Autowired@Override//1.通过工具生成图片验证码,hutool//长、宽、位数、干扰线数量//2.把验证码存储到redis中,设置redis的key：uuid,value:验证码，过期时间//获取验证码值//获取验证码图片//修改验证码突破原色(先改变背景色，然后重新生成图片，将图片转为base64)//3.返回ValidateCodeVo对象。
2024-12-20 15:15:53
475
原创 java-4自定义异常处理
Data // 生成get/set方法2.创建自定义异常类处理方法//全局异常处理@ResponseBody //处理返回的数据格式为json//自定义异常处理@ExceptionHandler(GuiguException.class)//此处传入自定义异常类的class，表示针对这种异常做处理3.使用。
2024-12-12 21:02:24
151
原创 java-1用户登录接口
在spzx-manager服务的src/resources目录下创建application.yml、application-dev.yml文件，文件的内容如下所示：导入mybatis-config.xml和logback-spring.xml配置文件-- 日志的输出目录 -->--控制台日志格式：彩色日志-->-- magenta:洋红 -->-- boldMagenta:粗红-->-- cyan:青色 -->-- white:白色 -->-- magenta:洋红 -->
2024-12-12 01:27:38
673
原创 安装redis
Redis的常用命令包括SET、GET、LPUSH、RPUSH、HSET、HGET等，用于操作Redis中的字符串、列表、哈希等数据结构。如果Redis服务器运行在不同的主机上或使用了非默认端口，可以使用redis-cli -h -p 来指定主机和端口。安装成功后，你可以通过Windows的服务管理器来修改Redis服务的登录身份（如果需要的话）。如果想方便地使用Redis命令，可以将Redis的路径添加到系统的环境变量中。使用redis-cli命令连接到Redis服务器。F:\服务端文件\Redis。
2024-12-09 23:00:06
592
原创 uniapp中如何进行微信小程序的分包
思路：在uniapp中对微信小程序进行分包，和原生微信小程序进行分包的操作基本上没区别，主要就是在pages.json中进行配置。此时需要在pages.json中的subPackages数组中新增一项。使用这个包中的页面时需要带上根路径的前缀，如进行tabbar页面的跳转。如图，我新增了一个包diver-page。pages代表这个包中所有的页面。root代表这个包的根路径。
2024-07-01 19:47:38
515
原创 uniapp如何根据不同角色自定义不同的tabbar
第二张思路就不赘述了，直接用上面的tabbar封装成组件引用即可，主要在pages.json中将tabbarlist设为空数组。1.第一种是根据登录时获取的不同角色信息，来进行 跳转到不同的页面，在这些页面中使用自定义tabbar。2.在tabbar页面中完成自定义tabbar，并完成根据激活的tabbar展示不同页面的逻辑。2.第二种思路是封装一个自定义tabbar组件，然后在所有要展示tabbar的页面中引入使用。1.根据手机号码一键登录，在回调中获取用户信息进行跳转。
2024-07-01 19:39:40
1134
原创 TS-元组
元组是TypeScript独有的新类型，通常用于表示长度较固定的数组，并可分别指定每个元素的类型。在JavaScript中并没有元组这一概念，TypeScript的元组编译成JavaScript的元组后，代码类型依然是数组，元组更多是在编译过程中起限定作用的，是一种“语法糖”。
2024-06-30 15:39:11
1125
原创 TS-字面量类型
例如，以下代码将变量number1声明为1、2、3字面量类型，因此取值只能为1、2、3中的一个，如果赋其他值，会引起编译错误。字面量在代码中表示固定值。在TypeScript中，字面量包括字符串、数值、布尔值、长整型值、对象、数组、函数、正则表达式、null等，例如，以下都是字面量。字面量类型的变量只能被赋予字面量值，如果尝试给以上变量赋其他值，就会引起编译错误，示例代码如下。基于字面量，创建字面量类型，字面量类型可以理解为仅表示固定值的类型，其定义方式如下。
2024-06-30 15:25:32
403
原创 px2rem配置黑名单忽略el-loading样式转换
配置.postcssrc.js中的selectorBlackList。使用px2rem发现el-loading样式被转换的很小。可以忽略调对应前缀的选择器。
2024-06-29 16:52:02
224
原创 代码提交检查husky+Lint-staged+Commitizen & cz-git
注意一定要使用pnpm来下载所有的husky包，不然到后面无法生成commit-msg钩子Husky + Lint-staged + Commitlint + Commitizen + cz-git 来配置 Git 提交代码规范。
2024-06-29 16:45:47
2028
原创 stylelint 配置
扩展 stylelint-config-recommended 共享配置并为 SCSS 配置其规则。扩展 stylelint-config-recommended 共享配置并为 Vue 配置其规则。共享 HTML (类似 HTML) 配置，捆绑 postcss-html 并对其进行配置。stylelint-config-recommended-scss 文档。stylelint-config-recommended-vue 文档。stylelint-config-html 文档。提供优化样式顺序的配置。
2024-06-28 12:57:02
821
原创 Eslint & prettier & airbnb规范 配置
这个配置项也是基于风格偏好的，一些人喜欢在最后一个元素后加上逗号（称为尾后逗号），因为这样在添加新元素时可以减少版本控制中的差异（只增加一行，而不是修改一行加一行）。段代码是Prettier代码格式化工具的配置文件的内容，通常存储为.prettierrc或prettier.config.js。Prettier是一个流行的代码格式化工具，用于确保代码的一致性和风格。这个配置影响代码的可读性和布局，2是一个比较常见的选择，因为它既保持了代码的紧凑，也足够清晰。eslint：代码质量检查工具。
2024-06-28 12:01:24
2061
原创 TS-常量枚举
如果使用普通的数值枚举或字符串枚举，在编译成JavaScript代码后会产生较多代码来支持各项功能，开销较大且可读性较差，而且很可能被人误用。此时如果编译这段代码，你可以发现它与普通枚举编译后产生的JavaScript代码存在区别。以下是普通枚举编译后产生的JavaScript代码。要定义常量枚举，只需在普通枚举的定义前面加上const关键字，示例代码如下。如果对常量枚举使用索引查找或反向映射，编译将无法通过，示例代码如下。以下是常量枚举编译后产生的JavaScript代码，整体上更精简。
2024-06-27 23:55:43
421
原创 docker部署vue项目
Docker Desktop启动的时候，有可能弹框提示"WSL2 installations is incomplete"，这是您的系统中没有安装WSL2内核的原因，打开。其中关键的部分是要开启电脑的虚拟化功能，在bios中打开即可，课直接百度如何通过bios打开电脑的虚拟化功能。,在打开的页面中有一个Linux内核更新包"链接，点击下载，安装。wsl --list --online 查看可以使用的虚拟机。docker会在当前目录下寻找dockerfile文件。需要依托于服务进行暴露访问。
2024-06-27 23:15:43
1051
原创 使用axios+vue在离开页面时中断网络请求
第二步：在封装好的接口方法中加入cancelToken配置属性，并且传入this对象。最近做到一个需求需要在离开页面时中断未完成的网络请求。引入axios和CancelToken实例。第三步：离开页面时出发取消请求的方法。观察网络请求可以发现请求被取消了。
2024-06-02 23:47:37
532
原创 解决for in 遍历js对象，得到的顺序不正确问题
因为对象中没有顺序，他不是数组，所以想要得到一个顺序就首先要只给对象指定规则，这里是通过对象的value的字母来指定的规则。用for in之后发现每次得到的对象属性的顺序都不是按照后端数据源来排序的。最近在项目中需要遍历一个对象，按照顺序来渲染。
2024-06-02 23:45:23
626
原创 TS-引用类型的分类
复合引用类型通常都需要用户自行定义该类型的组成形式。例如，对于数组和元组，需要自行定义其组成类型和长度；对于函数，需要自行定义其参数、行为及返回值；对于对象或类的实例，则需要自行定义它们的成员、结构和行为。2.内置引用类型：包括Date（日期）对象、RegExp（正则表达式）对象、Math（数学）对象等。对于内置引用类型，通常已经由编程语言定义好该类型的结构、成员和行为，用户直接使用即可。1.复合引用类型：包括数组、元组、函数、对象、类的实例等。在TypeScript中，把引用类型分为以下两个大类。
2024-06-01 23:25:10
274
原创 TS-引用类型
TS中的数据值分为原始值和引用值两种类型。原始值即最简单的数据，而引用值则是有多个值构成的复合对象。原始值和引用值的声明方式类似，都需要创建常量或变量，然后对其赋值。其不同之处是，在变量或常量保存之后，可以对这个值进行的操作有所区别。
2024-06-01 23:22:58
1477
原创 TS-类型转换（显式）
要将其他类型转换为布尔类型，只需要将待转换的值传入Boolean()函数Boolean()函数会判断传入的值是空值还是非空值。若表示非空值，则返回true若表示空值，则返回false在TypeScipt中，以下5种值在一定程度上都有空值的含义，转换后会返回false，而对于其他值都会返回true1.undefined(无初始值)2.null(无值)3.NaN(非正确数字)4.05.""（空字符串）
2024-05-31 22:29:19
1860
1
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人