- 博客(32)
- 收藏
- 关注
原创 elementPlus版本升级,el-select默认值显示问题
摘要:ElementPlus升级至2.7.4+后,el-select对空值检测更严格。当v-model为null/undefined/""时,会显示placeholder而非"全部"选项,但下拉列表仍显示勾选状态。解决方法有两种:1) 单个组件添加:empty-values="[null,undefined]"属性;2) 全局配置ElSelect.props.emptyValues。全局方案会影响所有空值""的显示效果,需逐个检
2025-12-25 16:01:53
373
原创 mac电脑免费使用Typora教程
本文详细介绍了Typora 1.10.8版本的安装与激活方法:首先在官网下载1.10.6版本(实际为1.10.8),通过拖拽安装;然后修改LicenseIndex文件中的激活代码;针对Mac系统的安全性提示,提供了两种终端指令解决方案;最后还解决了激活弹窗自动关闭的问题,通过修改license.html文件添加延时关闭脚本。文章提供了完整的操作步骤和文件路径指引。
2025-11-24 14:45:25
6386
13
原创 echarts,环形图,点击事件
本文介绍了使用ECharts实现环形图点击交互功能的方法。通过v-chart组件定义@click事件和ref引用,在脚本中使用chartRefs获取图表实例。核心逻辑是使用containPixel方法判断点击位置在圆环还是中间区域,分别处理不同区域的点击事件。圆环部分点击可获取对应区块名称进行处理,中间区域点击触发特定逻辑。需要注意的是,该方法仅能识别中间有数据区域的点击,空白区域不会触发事件。文章提供了完整的Vue3+TypeScript实现代码,包括环形图配置、样式定义和点击事件处理函数。
2025-08-15 09:29:07
480
原创 vue3,使用v-draggable拖动时卡顿的问题
摘要 在使用v-draggable实现拖拽功能时,文字内容拖拽流畅,但图片拖拽会出现明显卡顿。主要原因包括:1)未优化的大尺寸图片导致布局计算负担;2)图片重绘开销高于文本。解决方案是通过CSS的pointer-events:none属性让鼠标事件穿透图片,由外层div处理拖动,减少事件计算。示例代码展示了如何为图片容器添加该属性以优化性能。
2025-08-14 19:39:37
369
原创 vue3+element-plus,el-popover实现筛选弹窗的方法
本文介绍了两种实现筛选弹窗的方法:1. 使用ref+hide方法,通过popoverRef.value.hide()关闭弹窗,利用sessionStorage保存/恢复筛选参数;2. 通过visible属性和v-click-outside指令手动控制弹窗显示/隐藏。关键功能包括:点击外部关闭弹窗不保存编辑、确定按钮保存参数、重置按钮不清空表单但保留弹窗、点击筛选按钮切换弹窗状态。
2025-08-06 15:48:30
811
原创 vue3+element-plus,el-autocomplete远程搜索,解决下拉框闪一下的问题
解决el-autocomplete远程搜索下拉框闪动问题:当使用Element-Plus的el-autocomplete进行远程搜索时,即使设置hide-loading,无数据时仍会出现下拉框闪动。
2025-07-21 19:30:25
492
原创 vue3+element-plus,实现两个表格同步滚动
实现双表格同步滚动效果的关键步骤: 结构布局 - 使用相同宽度的左右表格容器,并设置固定高度触发滚动 数据准备 - 确保两边表格行数相同,保持数据对应关系 滚动同步 - 通过JavaScript监听两个表格的scroll事件,使用isSyncingScroll标志避免循环触发 DOM获取 - 通过querySelector获取表格的实际滚动容器(.el-scrollbar__wrap) 事件处理 - 在滚动事件中同步另一个表格的scrollTop值。
2025-06-27 10:17:25
922
原创 vue3使用富文本编辑器
摘要:本文介绍了使用WangEditor富文本编辑器的基础实现方法。通过Vue组件封装,展示了如何配置编辑器工具条(保留五种颜色、加粗和项目符号功能),并添加字数限制功能(200字符)。代码示例包含父子组件实现,包括编辑器实例管理、自定义粘贴处理以及样式配置。该方案提供了轻量级的富文本编辑解决方案,开发者可根据需求参考官网扩展更多功能。
2025-06-03 22:00:51
1117
1
原创 使用密码输入框,初始默认值的问题
在Vue3+Element Plus开发中,使用密码框时遇到Chrome浏览器自动填充问题:初始值设为空却显示有值。这是由于浏览器自动填充用户名/密码字段导致的。解决方法是为密码框添加autocomplete=new-password属性,禁用浏览器自动填充功能。示例代码展示如何在el-input组件中应用该解决方案,确保密码框初始状态为空值。
2025-05-24 17:00:19
390
原创 使用css实现呼吸灯效果
本文介绍了使用CSS实现三种呼吸灯效果的方法。第一种是实心圆不变的呼吸灯,通过伪元素和transform: scale()实现扩散效果。第二种是实心圆随变动的呼吸灯,利用@keyframes动画调整圆的大小和阴影强度。第三种是空心圆呼吸灯,只需去掉背景颜色即可。每种效果都通过简单的HTML结构和CSS样式实现,适合初学者快速掌握。
2025-05-19 10:39:24
1367
原创 vue3+element,使用SockJS和WebSocket封装
/4通过stompClient.subscribe()订阅服务器的目标是'/user/' + userId + '/msg'接收一对一的推送消息,其中userId由服务端传递过来,用于表示唯一的用户,通过此值将消息精确推送给一个用户。//1连接SockJS的endpoint是“endpointWisely”,与后台代码中注册的endpoint要一样。messageRef.value = ElMessageBox.confirm(content, '提示', {', '提示', {
2024-08-16 10:06:31
2751
2
原创 vue3+ts+element-plus,实现el-table表格内数据上下滑动的时候,右侧的类别也上下变更
当用户点击右侧的类别的时候,左侧的列表也要迅速定位到该类别的数据上。这里我们就需要用到IntersectionObserver(交叉观察器),observe:开始监听特定元素(需要接收一个target参数,值是Element类型,用来指定。接下来就是groupArray右侧显示的类别,通过groupArray循环来设置列表数据里每个group第一个科目的group名称。我这里用for循环模拟了一部分数据,具体数据如下图所示,其中最重要的是groupId,判断这条数据的类别。添加右侧的类别点击事件。
2024-04-28 16:06:11
923
原创 vue3从接口拿到数据赋值失去响应式的问题
因此我们在开发的时候,就会遇到一个问题,我从后端拿到数据后,再赋值的时候,会看到接口的数据并没有运用在页面上。
2024-04-18 17:05:51
984
1
原创 vue实现表格表头在左侧,并且固定表头
前段时间一个h5端的项目,需要实现一个表格,然后表格的表头放在左侧一列,并且左右滚动的时候需要固定表头,不能随着滚动条滚动一起动。但是在网上找了很多类似的,思路是可以的,就是没有一个是我能运行起来的,最后就决定自己写一个。
2024-03-28 16:04:47
2553
1
原创 vue3+element-plus,在el-dialog中使用v-loading无效的解决方法
在使用el-dialog的时候,想要实现点击弹框,出现加载中的效果
2024-03-18 10:49:19
7900
6
原创 在钉钉上点击图片实现放大功能
我这次遇到的问题就是,我选择一张图后,是需要识别这张图上面的文字,就比如我需要识别营业执照的内容,但是我点击放大后会提示我看不了,我打印了一下这个url地址后复制后在页面上看了下,发现是因为我无权访问此对象,意思就是这张图加密了。首先我们选择一张图片后,要先显示在页面上,这时候就需要使用一个函数来回显它,因为我们选择图片后,选择的是他的url地址,我们需要把这个url地址变成能够让系统识别出来的地址,然后解密这个url地址,最后实现回显。
2023-11-06 17:44:51
2145
2
原创 Error in mounted hook: “TypeError: Cannot read properties of undefined (reading ‘split‘)“
其实之前也遇到过这种问题,出现了两三次就觉得还是记下来比较好。之前的问题是我的数据已经存在一个对象中了,然后要把这个对象传到另一个组件里,在mounted来打印是空的,最后我是用watch监听来解决的。,简单来说就是初始化太快了,我的接口数据还没赋值就已经完成初始化了,所以才会报错。这个是我的代码,其实就是多做了一个步骤,我其实没有必要要那个setData,直接在data定义一个对象就可以了。
2023-07-11 17:11:03
8657
1
原创 vue2,页面跳转传惨,数据过去了,页面没有实时更新的问题
我正在写一个模块,然后这个模块有权限设置,分为创建人和反馈人,两人看到的东西不同,颜色图标也不同,就是在首页点击按钮跳转到另一个页面,然后另一个页面里面有的图标会根据你是创建人还是反馈人来分别显示不同的图标, 我的问题就是根据是否是创建人或反馈人是通过boolean布尔值来判断的,然后在跳转页面的时候把这个布尔值传过去,问题就在这里,我布尔值传过去了,也打印出来了,如下图所示。但是页面图标还是不变,在网上也找了很多,说什么是缓存的问题什么的,方式都试了,不适用于我。,这种问题,图标会出来才有问题呢!
2023-06-28 15:55:35
352
1
原创 前端接收老项目启动时报错These dependencies were not found
那么这是什么原因呢?主要就是你的插件版本问题,我这个就是echarts版本太高了,echarts是5的版本。
2023-05-24 21:40:39
2571
原创 文件上传gitee中出现问题fatal: remote origin already exists.(远程来源已存在) 解决方法
文件上传gitee中出现问题fatal: remote origin already exists.(远程来源已存在) 解决方法
2023-04-03 10:23:54
2211
原创 前后端交互工具---ajax
ajax (全名:Asynchronous Javascript And XML)其实就是异步的javaScript和XML。
2022-12-26 17:23:14
556
原创 js中的深拷贝与浅拷贝
我有一个朋友,朋友穿的一件衣服我很喜欢,然后我就把她衣服拿过来自己穿上了,但是我在衣服上弄上污渍了,还给那个朋友的时候,那个朋友的衣服上有污渍,这就是浅拷贝。深拷贝:我有一个朋友,朋友穿的一件衣服我很喜欢,然后我找她要了链接自己也买了一件,现在有了两件一样的衣服,当我在我的衣服上弄上污渍了,朋友的那件衣服上还是干净的,这就是深拷贝。
2022-12-07 20:48:19
3815
原创 JavaScript继承
寄生组合继承存在效率问题,最主要的效率问题是父类构造函数始终被调用两次,一次是在创建子类原型时调用,另一次是在子类构造函数中调用,本质上,子类原型最终是要包含超类对象的所有实例属性,子类构造函数只要在执行的时候重写自己的原型就可以了。把子类的原型对象指向父类,就能使用父类中的方法和属性了。采用原型式继承不自定义类型,临时创建一个构造函数,借助已有的对象作为临时构造函数的原型,然后在此基础实例化对象,并返回。继承就是指一个子类继承父类的属性和方法,使得子类对象(实例化对象)具有父类的方法和属性。
2022-11-28 15:23:58
1953
原创 JavaScirpt中this指向
首先我们要清楚什么是this指向?只要是写代码的,都知道this随处可见,我们必须要清楚this是js语言的一个关键字,代表函数运行时自动生成的一个内部对象,只能在函数内部使用,随着使用场合的不同,this的值也会发生变化。。这么讲可能有点太广泛了,接下来先介绍this指向的几个场景。this在不同环境下、不同作用下,表现的也不同。以下是this指向的几个场景。
2022-11-27 16:23:52
431
原创 磨砂玻璃效果
在学习中我发现了一个好玩的效果,话不多说,先看效果图:看上图,我们可以发现,中间的字是不是看的不是很清晰,这就是磨砂玻璃的效果,具体怎么实现,也很简单,就一句代码就能实现。filter :滤镜,我们通常都会想到用滤镜大的模糊度来实现,但是需要注意首先我们先来实现基本的样式。
2022-11-20 14:40:54
884
原创 使用html+css+jquery实现3D轮播图
这里需要注意的是,如果你不设置一个开过和定时器,当你点击下一张时点击一次没问题,但是连续点击就会出现一点bug,所以我加了一个开关思想,只有一张图片完整的呈现在眼前后,下一张图片才能出来。css部分就是设置样式了,首先就是先给盒子一个宽高,盒子是装显示一张图片的,接下来就是li了,给li设置绝对定位,不然图片不会对齐的。HTML部分首先我们需要一个盒子显示图片,然后在盒子里装入图片,你想装几张图片就可以写几个li,除了图片我们还需要一个按钮来点击。首先就是需要几张图片,但只有一张是显示在我们眼前的。
2022-11-13 16:58:07
2449
1
原创 使用js定时器实现 随机点名
话不多说,先来看看效果:首先还是要先理清思路,随机点名是当你点击开始按钮的时候,开始出现名字,点击暂停,就停止。这里需要用到的技术有HTML、CSS、js。
2022-10-30 16:03:01
1357
1
原创 使用js定时器实现倒计时功能
首先还是先理一下思路,先要确定一个具体的时间,你想从哪个时间到哪个时间,我这个就是从现在的时间到2022年过年,然后使用data对象获取天、小时、分钟、秒,之后再使用定时器让它像上图一样能够一直保持运动的状态。new data()表示的是当前时间,也就是电脑上的时间,如果前面有个+,表示的当前时间的毫秒,转换为毫秒了。还需要注意的一点是截止时间是阳历的时间,因为获取的当前时间是阳历的,所以截止时间也是阳历的,这点需要注意。倒计时使用的技术主要就是js中的定时器。
2022-10-30 15:59:02
1662
原创 JS初级知识整理
js初级知识有很多,如js的引用、数据类型(分为简单数据类型和引用数据类型)、运算符、流程控制、循环结构、数组、函数、变量、对象等,在这里我就先介绍我认为比较重点的几个吧。
2022-10-23 21:13:01
258
原创 如何使用js写出九九乘法表,空格如何对齐
第三步:判断行和空格的关系,理解的时候先把1*1=1当成一个空格,第一行的时候,没有空格,第二行的时候,一个空格,第三行的收,两个空格......以此类推,行和空格的关系为:k = 1;第二步:行为1的时候,列是从1开始,一直到9,行为2的时候,列从2开始,行为3的时候,列从3开始......因此行和列的关系是:j=i;第四步:使用三个for循环写,提示:列和空格没有联系,空格之和行有联系,所以for循环里,空格和列是并排的,但是他们都是嵌套在行的for循环里。第一步:定义三个变量,代表行、列和空格。
2022-10-16 18:26:31
1331
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅