- 博客(138)
- 收藏
- 关注
原创 【Vue3+Element Plus】el-dialog弹窗点击遮罩层无法关闭弹窗问题记录
新建了一个Vue3+TypeScript项目,引入了Element Plus组件,使用的是自动导入的方式,项目运行后发现el-dialog弹窗组件点击遮罩层无法关闭,排查了很久也没发现有什么问题。打开无痕模式访问页面,却发现弹窗可以关闭;另外我再新建一个终端去运行项目也是可以关闭的(就是比如我一开始运行是5173端口,再新建终端运行就是5174端口,5173那个无法关闭,5174这个可以关闭)
2025-12-29 16:06:57
158
原创 【Vue3 + Element Plus】Form表单按下Enter键导致页面刷新问题
Form表单按下Enter键导致页面刷新,是浏览器的默认行为所导致的,要避免这种情况,可以通过阻止默认的提交行为来禁止页面刷新。
2025-12-29 11:10:11
169
原创 【Vue3+Element Plus+Vite】按需导入Element Plus组件并配置全局样式文件
本文介绍了Vue项目中Element Plus的配置方案,包括:1) 按需自动导入组件;2) 全局SCSS变量管理;3) 响应式布局实现。通过unplugin-vue-components插件实现按需导入,创建variable.scss定义CSS变量和媒体查询断点,并配置主题色覆盖Element默认样式。最后在global.scss中引入主题配置并实现PC/移动端响应式控制,通过类名切换不同设备显示效果。整个方案实现了组件按需加载、主题定制和响应式适配的完整前端架构。
2025-12-12 10:59:02
228
原创 【Vue3】VerticalProgressBar内存占比进度组件
本文展示了一个垂直进度条组件,采用分层设计实现从下往上的动态填充效果。组件核心特性包括:1) 可自定义标题和百分比值;2) 通过层数控制精度;3) 支持部分高度填充过渡效果。实现方式采用Vue3组合式API,通过计算属性动态生成背景层和填充块,CSS使用flex布局实现垂直排列。组件参数包括title(标题)、percentage(0-100百分比)和layerCount(分层数),填充颜色通过CSS变量控制,适用于系统监控等场景的数据可视化展示。
2025-12-12 10:30:20
38
原创 【Vue3+Element Plus】表单数组中字段自定义校验规则
在rules配置中,为字段activeValue添加validator函数,实现根据当前值类型(valueType)验证输入是否为有效的十进制或十六进制值。
2025-11-26 11:06:06
160
原创 【Vue3】使用websocket实现前后端实时更新数据
WebSocket是一种在单个TCP连接上进行全双工通讯的协议。它允许服务器主动发送消息到客户端。
2025-10-16 16:21:35
453
原创 【React】组件通信
子组件只能读取props中的数据,不能直接进行修改, 父组件的数据只能由父组件修改场景:当我们把内容嵌套在组件的标签内部时,组件会自动在名为children的prop属性中接收该内容。
2025-09-28 14:12:16
196
原创 【CSS】实现伪元素层级在父元素之下
伪元素默认层级是在父元素之上的,同时 ::after在::before之上,若要实现伪元素层级在父元素之下,则可通过以下方式实现。
2024-08-26 14:07:21
772
原创 【uniapp】单选框、复选框点击整行选中效果实现
单选框<view class="list-item" v-for="(item, index) in cardList" :key="index" @click="radioChange(item)"> <image class="list-item-icon" :src="item.bankUrl" mode=""></image> <view class="list-item-name">{{ item.bankName }}</view&
2024-05-15 10:59:09
1388
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅
1