- 博客(79)
- 收藏
- 关注
RSS订阅
原创 “智慧医疗系统”Axure系统原型设计
本系统设计的是一个智慧医疗系统的网站，此网站让用户实现了足不出户就可以在电脑前进行网上查看智慧医疗信息。不需要亲临现场就可以在网站上进行操作。
2023-12-04 12:48:32
3793
4
原创 【前端Vue】el-dialog关闭后黑色遮罩依然存在如何解决？
【摘要】开发中遇到el-dialog关闭后黑色遮罩残留问题，表现为首次打开弹窗时关闭后遮罩不消失。该问题出现在嵌套弹窗场景（大弹窗含小弹窗），官方文档未明确说明解决方案。AI建议添加:modal-append-to-body="false"属性但效果不稳定。最终通过将:append-to-body属性设置为true成功解决问题，测试未再出现遮罩残留现象。
2025-09-11 17:20:48
431
原创 【前端Vue】如何优雅地在vue中引入ace-editor编辑器
本文介绍了如何在Vue项目中集成Ace代码编辑器。主要步骤包括：1)通过npm安装brace和vue2-ace-editor依赖；2)在组件中引入AceEditor及相关语言模式、主题；3)提供两种数据绑定方式（value+@input或v-model）；4)详细说明编辑器配置选项，包括样式、行为、渲染等参数；5)展示基本实现效果。文章还列举了可用的主题选项，并提供了官方文档和在线demo参考链接。
2025-09-11 17:07:16
1372
原创 【前端Vue】使用ElementUI实现表单中可选择可编辑的下拉框
本文介绍了在Vue框架下基于ElementUI的el-autocomplete组件实现可编辑下拉框的解决方案。针对原生组件无法同时满足可编辑、下拉选择、箭头指示等需求的问题，通过自定义开发实现了以下功能：1）在输入框为空时显示下拉箭头和候选列表；2）选中内容后自动隐藏列表；3）编辑已选内容时不触发下拉；4）清空内容后重新显示候选列表。技术实现上通过动态类绑定控制箭头方向与下拉状态联动，添加事件处理延迟隐藏防止误操作，并优化了用户体验。样式部分实现了箭头旋转动画和显示/隐藏逻辑。
2025-08-13 16:20:14
834
原创 【前端Vue】如何在log-viewer组件中添加搜索定位功能
本文介绍了在日志查看器中实现搜索功能的方法。通过添加搜索框和操作按钮，支持关键词搜索、结果导航和高亮显示。主要功能包括：1) 输入框支持关键词输入和清空；2) 上下按钮可导航搜索结果；3) 显示搜索结果统计；4) 使用正则表达式匹配文本；5) 当前结果显示为绿色背景，其他结果显示为黄色；6) 自动滚动定位到搜索结果行。实现涉及数据绑定、正则匹配、ANSI转义序列高亮等技术，通过计算属性实现搜索状态与显示内容的联动。
2025-08-12 17:35:23
344
原创 【前端Vue】log-viewer组件的使用技巧
本文介绍了如何优化log-viewer组件的显示效果，使其更接近ace-editor的美观程度。修改内容包括：调整行号样式、内容区域的字体和背景色、鼠标悬停效果以及滚动条样式。通过调整.line-wrapper.line-number的间距和宽度，确保行号显示正常。文章还详细说明了如何实现关键词高亮功能，包括使用正则表达式匹配关键词并应用ANSI转义序列来改变字体颜色，以及在CSS中自定义高亮颜色。最后提到可以通过computed方法处理后端数据，将处理后的内容绑定到log-viewer组件。
2025-08-12 16:35:10
754
原创 【前端Vue】使用log-viewer组件时的踩坑记录
摘要：在使用ElementUI抽屉组件实现文件预览功能时，出现首次打开正常但再次打开内容显示空白的问题。原因是DOM未更新导致，通过为log-viewer组件绑定动态key属性（drawerViewerKey），在打开抽屉时自增key值强制刷新DOM，解决了内容空白和自动定位失效的问题。该方法无需重复调用接口，对性能无影响，有效保证了组件正常显示。
2025-08-12 14:41:00
303
原创 【前端Vue】如何优雅地展示带行号的日志文件或文本内容（log-viewer组件的使用）
本文对比了ace-editor和log-viewer两款前端日志展示组件的性能表现。虽然ace-editor界面美观但处理大文件时易卡顿，而log-viewer虽然UI简单但能流畅展示80万行内容。文章详细介绍了log-viewer的使用方法，包括如何通过getFileContent接口获取文件内容并绑定到组件，以及相关配置项如加载动画和行号显示的控制。最后提供了组件的安装方式和GitHub地址，为处理浏览器端大量日志数据显示提供了实用解决方案。
2025-08-12 14:36:48
842
原创 【前端Vue】this.resetForm(“form“)重置表单时出现indexOf报错的解决方案
取消使用后报错也会消失，但如果使用v-show可能会存在校验的问题，因为使用时用户看不见字段，但校验规则依然会进行获取和校验，容易埋下隐患，只可临时使用。—— 它是 Element UI 提供的用于清空验证状态的方法，需要根据Element UI的设计规则来使用。来设置表单字段的显示，但是出现了indexOf的报错，多次尝试后发现将。标签，在该标签中需要每个都加上。
2025-07-16 11:49:17
327
原创 【前端Vue】如何实现echarts图表根据父元素宽度自适应大小
当前我遇到的场景是页面侧边导航栏会产生展开和收缩的变化，其变化会挤压拉伸页面区域，如果echarts图表布局在这些区域，会影响到显示效果；随后在mounted()函数中添加使用ResizeObserver API（用于监听DOM节点变化的API，实现自适应的关键点）我这里涉及到的是宽度的变化，因此需要在图表组件处将width设置为100%，如果高度也要自适应，跟宽度一样的原理。还需要将图表在echarts的配置代码中调整好合适的位置。这是导航菜单展开的效果。这是导航菜单收缩的效果。这是浏览器缩放后的效果。
2025-07-04 16:08:55
323
原创 【前端Vue】flex-shrink属性的压缩用法
flex-shrink: 0可以理解为其不受压缩限制，在同一个div中其始终按照自己1:1的宽度进行显示，flex-shrink: 1则会按照情况进行自身宽度的压缩或还原。将元素A和元素B限制在一个固定宽度的div内，元素A显示宽度随元素B的宽度进行动态调整（即在固定宽度内，元素A要受到因元素B宽度可能增加的变化而带来的压缩）计算每个元素压缩率： S1 = a * w1 / sum，S2 =b * w2 / sum；元素A和元素B的flex-shrink：a，b；元素A和元素B的width：w1，w2；
2025-06-12 10:59:43
329
原创 【前端Vue】修改ElementUI进度条样式（消除圆角、增加渐变色、文字阴影）
本文介绍了如何通过自定义CSS样式对ElementUI进度条进行深度个性化修改。主要内容包括：1) 进度条组件默认配置的局限性；2) 通过样式修改实现圆角取消、背景渐变、文字位置调整和阴影效果；3) 具体CSS代码示例，展示了如何针对.el-progress-bar__inner(已完成部分)、.el-progress-bar__outer(未完成部分)和.el-progress-bar__innerText(百分比文字)进行样式定制。虽然方法简单，但效果显著，为开发者提供了超出官方配置的个性化解决方案。
2025-06-04 15:00:26
482
原创 【前端Vue】如何在选择不同单选框切换页面时检查页面中是否出现某个元素
我开发的功能是在选择不同单选框后，可以切换表单，其中有一个表单项只有选中某些单选框才会显示，我需要根据这部分是否显示来判断某一个操作按钮是否显示，功能按钮的作用是将某个文件的路径点击直接填充到那个表单元素中，所以在那个元素没有显示的时候，该按钮不应该出现，我使用的是elementUI的单选框，这个单选框在其他地方会进行增删改，因此不可以通过单选框进行判断，但是可以将单选框的切换作为判断的时机，每切换一次就判断一次。因此需要判断就需要在该元素设置一个判断标志，我使用的是ref="modelFileCol"
2025-04-11 17:33:25
219
原创 【前端Vue】表格换行的部分以省略号显示并且悬停可以显示完整字段浮窗
【代码】【前端Vue】表格换行的部分以省略号显示并且悬停可以显示完整字段浮窗。
2025-02-21 17:41:52
502
原创 【前端Vue】快捷菜单跳转时如果需要在目标页面打开模态框怎么处理
这是点击快捷菜单的处理方法，包含了直接的路由跳转和跳转后根据方法进一步操作。目标页面控制模态框显示需要有方法，需要将其方法放进快捷菜单的数据项。以下是目标页面的一些函数，需要格外注意。以下是目标页面的控制模态框的方法，
2025-02-21 17:38:27
179
原创 【前端Vue】开发一个带有行号的编辑器或预览视图
是更新行号的方法，如果你需要使用弹窗之类的二层组件来显示，需要在打开方法中调用一次，当然了，如果是动态或通过接口获取内容，在response.data;想将textarea内容设置为只读，并且每行显示内容超出宽度的部分不断行（避免出现行号和实际内容不匹配的问题），直接显示（通过横向滚动条控制）如果用pre-wrap或pre-line会造成超出部分断行的情况，行号就不能真正对应上原本的内容了。如果不需要readonly属性，直接设置成这样就可以了。v-model的值就是你要显示的内容，需要进行设置。
2025-02-21 17:33:58
610
原创 【前端Vue】如何做一个可变状态的箭头（含动画）
如何做一个可变状态的箭头（含动画）？首先给组件绑定样式切换代码和方法。需要在data中声明的部分。
2025-02-21 17:27:28
252
原创 【前端Vue】使用另一个组件的方法进行传值
在子组件DataFile中，clear()方法是直接在methods中写出来的，让父组件进行调用。绑定另一个组件的方法，可以用于传值或其他需要联动的逻辑操作，避免使用。dataFileDetailSteps相当于是一个组件互相联络的载体。
2025-02-21 17:25:33
211
原创 【前端Vue】如何在文本展现时保留原格式
如果需保留换行和空格，但不完全按照原文字格式：（不使用<pre>）如果只需保留换行，可以加入以下样式：（不使用<pre>）有时浏览器的 HTML 解析器可能会移除多余的空白符。这样就可以完全保留原文字格式，包括换行和空格。使用 <pre> 标签包裹日志内容。防止 HTML 解析器移除空白符。在输出有格式的文本时要注意。
2025-02-21 16:43:12
421
原创 【前端Vue】如何实现全局操作按钮（文件上传）
点击全局上传按钮时或点击其他页面的上传按钮时，将更新呼出上传功能子组件，子组件按特定的路径进行上传，上传使用获取到并显示出来的路径，使用。采用以下方法进行传值，父组件一点击按钮就进行传值操作。负责父子组件传值，后者负责更新视图及数据。文件上传子组件接收方接受数据并更新视图。的全局配置文件，用于全局传输或保存数据。为例子，其他的父组件传递也是一样的。是用于取消上传时删除上传任务的。可以用于全局存储下载列表，上传页面（含路径）示意图。
2025-02-21 16:35:20
479
原创 【前端Vue】文字过多使用省略号和浮窗解决显示问题
当开发的组件遇到文字内容过长，超出设计的宽度时，可以使用省略号和浮窗解决显示问题。超出宽度的部分以省略号显示，并且在鼠标悬停在组件时，显示包含全部内容的浮窗。多行或单行文字固定宽度，多余的以省略号显示。标签后鼠标悬停可显示完整内容。
2025-02-21 16:19:41
700
原创 Loadrunner脚本的高级设置（13）
1)理解对虚拟用户脚本参数化的方法2)理解对虚拟用户脚本插入检查点的方法3)理解关联的概念、用途和意义4)了解脚本运行时的设置方法
2024-06-26 10:56:14
907
原创 LoadRunner录制无脚本与回放脚本时产生问题的解决方法Error:Vuser compiled.Please set CCIDDebug to Off in CCI sectio...
此情况适用于无法指定默认浏览器并能够关闭防火墙的场景
2024-05-29 11:22:20
1158
原创 Loadrunner的录制和脚本开发（12）
1)了解Loadrunner的测试流程2)理解Loadrunner的录制原理3)熟悉Loadrunner的脚本语言4)了解Loadrunner的相关函数
2024-05-29 11:05:37
3593
3
原创 QTP测试中回放脚本出现“找不到...对象（Cannot identify the object “...“......）”问题的解决方案
回放脚本出现“找不到...对象（Cannot identify the object "..."......）”问题的解决方案
2024-04-07 16:14:33
585
原创 银行自动柜员机ATM模拟系统测试（9）
（1）掌握分析测试需求，制订测试计划；（2）掌握设计和维护测试用例，部署测试环境；（3）熟悉执行测试，提交缺陷报告并追踪缺陷；（4）掌握编写软件项目系统功能测试报告。
2024-03-15 16:37:15
2042
1
基于SpringBoot+Vue前后端分离的在线商城系统
2024-03-12
Axure智慧医疗系统系统原型设计
2023-12-04
基于SpringBoot+Vue实现的前后端分离的在线商城系统
2023-12-01
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人