- 博客(74)
- 收藏
- 关注
原创 实现El-table 每行后面加验证
本文探讨了表格数据提交时校验提示的实现方案。作者比较了三种复杂方案后,选用了一种简洁的实现方式:在表格最后一列使用固定定位的提示语div,通过设置margin-left使其浮动在表格右侧。该方法避免了动态计算高度、修改表格结构等复杂操作,仅需简单的CSS定位即可实现校验提示功能。方案代码展示了如何在el-table-column模板中同时显示常规内容和浮动提示信息,兼顾了功能实现和开发效率。
2025-11-05 17:28:56
178
原创 Vue2项目依赖起不来解决方式
摘要:针对Vue2项目启动时出现的node版本错误和依赖缺失问题,本文提供了解决方案。首先清理npm缓存,删除node_modules和package-lock.json后重新安装依赖。若问题未解决,可使用npm install --legacy-peer-deps命令忽略对等依赖版本冲突继续安装。这是处理前端项目依赖冲突的有效方法。(98字)
2025-10-30 15:14:52
120
原创 前端开发--禁止用户复制内容
本文介绍了四种前端禁止用户复制文本内容的方法:1) 使用JavaScript阻止copy、cut、contextmenu等默认事件;2) 通过CSS的user-select:none属性禁止文本选中;3) 将文本转为Canvas渲染;4) 在复制内容时自动添加版权信息。这些方法适用于阻止普通用户随意复制,但敏感内容仍需服务端加密或权限控制实现真正保护。前端防复制技术主要用于基础内容防护和版权保护场景。
2025-10-29 15:52:33
299
原创 Vue2下项目集成DeepSeek API
本文介绍了如何创建并配置一个基于Vue2的DeepSeek问答应用。首先通过vue create命令创建项目,安装axios、markdown等必要依赖。核心功能包括:1)使用App.vue构建聊天界面,实现用户与AI的对话交互;2)通过deepseek.js配置API接口,支持流式响应和思考模式;3)实现消息渲染、Markdown解析、对话历史管理等功能。应用特点包含:实时对话流、消息分角色显示、错误处理、对话ID生成等,为用户提供智能问答体验。需要替换DEEPSEEK_API_KEY才能正常使用API服
2025-10-24 13:21:00
274
原创 ant-design-vue Notification 通知提醒框 内容换行
在Ant Design Vue的Notification组件中实现换行效果,可通过以下方式:1.使用ES6模板字符串包含换行符\n;2.设置CSS属性whiteSpace:'pre-wrap'以识别换行。具体实现中,循环处理多条消息时,将消息内容、类型和时间用\n连接,并在notification配置中添加样式设置。关键代码包括模板字符串拼接和whiteSpace样式配置,从而实现Notification中的自动换行显示效果。
2025-10-22 11:49:55
202
原创 Vue3+ant-design-vue 实现日历
这篇文章展示了一个基于Vue.js的日历组件实现方案。该组件主要功能包括:左侧显示年份列表支持搜索筛选,右侧展示对应年份的日历视图,并区分法定节假日、休息日和工作日三种日期类型。技术实现上使用了Ant Design Vue组件库,通过day.js处理日期,实现了响应式布局、数据动态渲染和交互功能。日历视图采用网格布局展示12个月份,每个月份卡片显示不同类型日期的统计数量和样式标记。文章提供了完整的Vue模板代码、JavaScript逻辑和CSS样式,并附有JSON数据格式说明和最终效果图参考。
2025-10-13 15:54:39
364
1
原创 Vue3+Ant-design-vue 实现树形穿梭框
1.需求:实现树形结构的穿梭框,并且可以左右来回穿梭,穿梭箭头也是跟着左右俩侧树形结构选中状态而高亮(也就是左侧树形结构选完后 穿梭向右箭头要高亮 相反 右侧树形结构选完后 穿梭左箭头要高亮),左侧树形结构穿梭后 左侧选中节点置灰。2.数据格式 与后端同学确认好 可以以我这个为例子。4.有问题 随时欢迎大家来交流。
2025-08-29 13:37:50
240
原创 Vue3+Ant-design-vue+SSE实现实时进度条
7.其实也可以使用上传组件的进度事件 但是这个不是真正文件夹上传走的那个进度 所以我们这边采用了sse方式去实现。
2025-08-22 17:00:52
300
1
原创 解决npm ERR! code ENOENT npm ERR! spawn bash! npm ERR! -4058!npm ERR! spawn bash ENOENT!
4.后来就在想是不是终端哪一部分配置和git里不一样 有去查看node、npm、echo $SHELL、发现应该是SHELL 配置的原因导致的。2.排查这个问题的时候 有使用过重新安装依赖、查看环境变量是否有配置错误,后来检查完发现不是这方面的问题。3.最后用git 把项目拖进来 然后起动就能起来 然后使用vscdoe和终端都不行 可神奇了。5.最终解决办法 运行此命令以确保npm使用的事Windows的命令行,而不是bash。1.首先启动项目会报如图所示的错误。
2024-11-19 17:16:33
878
5
原创 Vue3+element-plus摘要
3-1 第一种方式 标签以外写 setup 函数,需要显式导入 defineComponent,但上下文指向组件实例,可以使用传统的生命周期钩子和直接访问组件的属性和方法。3-1-1 setup外部标签的时候 怎么获取组件传值的props 下面是详细代码,感兴趣的可以对比一下哈。1-5-3 点击变量中的path 点击编辑 完了把新增 把%vue_cli3%3-1-1-1 setup在<script></script>3-1-1-2 再<script> setup <script>
2024-11-07 11:44:14
665
原创 解决 vue3 中 Proxy(Object) 对象无法直接读取或使用
【代码】解决 vue3 中 Proxy(Object) 对象无法直接读取或使用。
2024-11-05 17:51:17
997
原创 全家桶工具介绍
如果是idea,pycharm出现,一般需要重启下电脑,然后重新activated即可,如果不行,请参考解决方案一。Mac系统请卸载掉其他版本,参考解决方案二或者参考终极解决方案为什么打不开?因为你配置的activated工具路径不对,肯定是你删除或者移动了activated工具。
2024-10-28 15:51:37
983
2
原创 Vuex-subscribe结合provide+inject实现多重组件传值、传方法
3-1 首先在src建store文件夹 再里面建modules和index.js、getters.js。3-3 在index.js和getter.js中。2.具体业务方法需求及代码实现。3-2 在main.js。3.vuex写法及用法。4.在子应用实际用法。
2024-10-28 11:28:28
367
1
原创 前端埋点(tracking)实现多种方式
1.前端埋点是用来跟踪用户行为、事件或页面加载情况的一种技术。2.第一种方式 静态的tracking.js。3.第二种方式 动态的tracking.js。
2024-10-21 11:35:04
653
原创 JavaScript处理字符串超过固定长度展示..
1.在Vue.js中,可以使用计算属性来截取字符串,并且在超过指定长度时添加省略号(..)
2024-10-17 14:35:06
335
1
原创 Vue3+Pinia
2-2 index.ts中调用demo.ts仓库。的互相调用(在上面代码中我们一直只使用了一个。仓库,其实在真实项目中我们往往是有多个。有多个Store时,就会涉及。仓库 index.ts。1.单纯调接口(安装。及引入如下第一张图)内部的互相调用问题)2-3 具体页面使用。
2024-07-02 16:56:21
590
原创 vue3的组件通信&v-model使用
再父组件中通过使用:msg='msg'绑定需要传给子组件的属性值,然后再在子组件中用props接收该属性值。在子组件的点击事件中 通过触发父组件中的自定义事件,把想传给父组件的信息以参数形式带过去 父组件便可拿到子组件传过来的值。插槽的基础用法非常简单,只需在 子组件 中使用 标签,就会将父组件传进来的 HTML 内容渲染出来。在子组件中,向外暴露出属性或方法,父组件便可以使用 ref 获取到子组件身上暴露的属性或方法。provide与inject 主要为父组件向子组件或多级嵌套的子组件通信。
2024-05-27 10:50:48
2900
原创 Property or method “__v_isRef“ is not defined on the instance
Property or method “__v_isRef” is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property遇到这种问题不要慌,我是在项目启动后点击页面会一直报这个错,我这个项目是
2024-05-22 14:58:33
945
原创 使用vscode前面几行被定住
滚动代码文档的时候,发现前面几行被定住了,想 css 的。一样,可能是之前我们不小心点到了这里,取消就好了。
2024-04-02 17:42:27
1057
3
原创 Python基础语法汇总+实例
3.还有一些小游戏:羊了个羊 烟花 等等有需要的话可私信。1.根据输入出生日期计算出年龄。2.增删改查学生信息。
2024-03-26 15:19:23
303
1
原创 MutationObserver详解
1.基于之前Chrome游览器插件开发的过程中,会遇到在插件控制台打印被安游览器页面的元素,一直未解决。后来找到了解决了办法可以使用MutationObserver;使用MutationObserver这个可以在被安游览器页面直接打印页面元素等等,可能你会说本来不就可以获取吗。会在最后附上插件具体代码。对一个节点添加观察器,就像使用addEventListener方法一样,多次添加同一个观察器是无效的,回调函数依然只会触发一次。但是,如果指定不同的options对象,就会被当作两个不同的观察器。
2024-03-08 10:57:42
961
原创 开发Chrome扩展插件
1.首先开发谷歌chrome扩展插件,没有严格的项目结构目录,但是需要保证里面有一个mainfest.json文件 (必不可少的文件)。4-4-3 每次更改完文件 需要在扩展程序页面点击重新加载 再点击检查弹出窗口 保持实时更新(图一、图二刷新按钮后的开关,再第一次加载完插件要保持为开启状态)4-3 点击 加载已解压的扩展程序 可能选取文件夹时,明明里面是有文件的,但是选的时候里面是没有的,是正常的,就这样选就可以了。4-4-1 第一个红框框 点一下 就会在导航哪里显示出来这个插件。图一为Edge游览器。
2024-03-04 11:36:11
1078
原创 使用echarts如何实现双y轴且实现指定数据使用y轴呢?
在项目中经常使用echarts,我们经常会用到双y轴伸直多y轴去展示数据,默认所有数据都是使用左边y轴去展示数据的 , 我们需要自己去设置,具体使用某一个y轴去展示指定的某一个具体的数据。
2024-01-24 16:19:39
1210
原创 解决el-radio-group只触发一次的问题
把原来绑在el-radio-group的事件取消调 再el-radio-button俩个上面都绑定@click.native.prevent="changeMerge(1)"一个传1 一个传2 这样就触发了。原来想的是用el-button来写,试过el-button点多少次都会触发二次确认框 但是你需求更改其样式,还要把其样式修改为el-radio-button的样式 工程量比较大 所以没深研究。1.需求是点击合并后,出来二次确认框。现在的问题是点击完出现二次确认框后,再次点击不出来二次确认框了。
2024-01-19 13:45:16
928
原创 Vue+ElementUI实现点击加号动态添加
1.需求是点击加号图标往下增加,最多增加5行,最少显示一行(每条前面输入框不能为空及每条的前面输入框的值不能重复)
2023-12-28 10:48:08
1420
原创 Vue+ElementUI实现输入框日期框下拉框动态展示
5.还有一个要处理的逻辑是 不是后端返的下拉框数据 而是通过接口拿得 如何放到对应的动态向下拉框数据源。2.对不符合的数据在进行一次处理 比如刚才上述提到的fieIdTypeRange。6.因为我这个是新增和修改都涉及到了 所以后端返回的格式非常重要。1.首先根据后端返回的数据格式获取类型从而展示对应的框。4.必填项验证 及别的验证(金额)
2023-12-08 13:19:43
1938
原创 Vue结合原生Table表头纵向排列
4.最后的效果(字段名称 字段定义省略号展示 鼠标放上去显示)3.样式(表头 内容多的省略号...,鼠标放上去显示全部)2.需求是一排12个 多余得往下拍。
2023-11-30 10:51:17
803
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅