- 博客(120)
- 收藏
- 关注
RSS订阅原创 vue2中provide传输的值不是响应式的问题
在vue2的项目中，祖孙级的值的传输，使用proived/inject传输数据的时候因对象本身未被或data初始化劫持，新属性无响应性。
2026-08-28 10:08:06
182
原创 根据数组中某个相同属性进行归类
在项目中一般会有需要根据数组对象的类型来对数组进行分类如下面那个原始数据需要根据type来进行统一分类，需要的效果如下：两数据对比如下图。
2026-08-27 15:19:08
138
原创 控制页面内容 点击向左/右移动 滚动scrollby()方法的使用
在项目中有时候需要点击按钮（左/右）后向那个方向滚动一下，来展示剩余的内容与element中的轮播图类似。
2026-08-27 14:32:01
114
原创 关于页面报错Resize0bserver loop completed with undelivered notifications的问题
但是，第二次打开就报错了(就是上面第一张图片)直接赋值，也就是写死，是没问题的，打开几次都不会报错如下图(注释掉的赋值部分)，但是动态赋值(注释掉的下面那个赋值部分)就会报错。这种报错就是更新的问题，多次尝试，定位到了表格的赋值上，当弹窗第一次打开，是正常展示的，如下图(正常展示)解决办法如下图，就是在那个DOM节点，加一个key如下图。
2026-07-10 14:53:34
201
原创 使用hooks根据屏幕大小判断是移动端还是web端
在有的项目中有时候需要根据屏幕大小判断是移动端还是web端，展示的样式不同，一般可以使用css的媒体查询可以做到，但是有时候 比如飞书链接直接打开网页会有问题 这时候需要使用js 来判断，而这个方法可能会在很多页面使用，那么这个时候就需要封装到hooks中引入到使用的页面中。
2025-10-31 14:36:50
227
原创 disable-devtool 网络安全 禁止打开控制台
《前端禁用开发者工具插件disable-devtool使用指南》 该插件通过多种方式保护前端代码安全： 核心功能：禁用右键菜单、F12/Ctrl+Shift+I快捷键，拦截浏览器菜单打开开发者工具 特色配置：支持MD5加密的开发者绕过机制，可自定义检测间隔(默认500ms)和跳转页面 技术优势：仅6KB大小，兼容主流浏览器，提供npm和script两种引入方式 安全机制：可配置管理员白名单，自动清空控制台日志，发现异常时跳转空白页 使用简便：三步即可集成（安装、引入、初始化配置），支持自定义加密参数名 注意
2025-10-10 14:35:44
635
原创 vue3 element-plus自定义el-select后缀图标
根据element-plus官网中给出的提示，中有个suffix-icon的属性，可以自定义后缀图标，并且传入的类型有string和Component。
2025-09-28 15:15:32
753
1
原创 manifest.json只有源码视图没其他配置
有时候我们从git上面拉下代码，第一次运行时发现，没运行项，再看manifest.json文件，就只有json文件，没有其他配置项。
2025-07-11 16:16:34
679
原创 uCharts秋云图表把选择日期弹窗覆盖问题
【摘要】在uniapp开发微信小程序时，使用ucharts图表组件会覆盖日期选择器。解决方案是在图表组件添加:canvas2d='true'属性，该修改在真机预览正常，但在微信开发者工具中会出现覆盖现象。需以真机效果为准，开发者工具显示问题可忽略。这种情况反映出uniapp在不同运行环境下的渲染差异，开发时应优先保证真机兼容性。（98字）
2025-07-09 15:51:52
273
原创 vue中的mixin传参（混入）的用法
本文介绍了在uniapp开发中通过mixin混入解决微信小程序背景图显示问题的方案。由于小程序中class的background-image不生效，需要将图片转为base64并在style中使用。作者通过创建可复用的mixin模块，封装图片与base64相互转换的逻辑，采用工厂函数模式支持不同图片路径转换。具体实现包括：1)安装image-tools库处理转换；2)创建mixin文件定义转换方法；3)在组件中引入mixin并传入参数；4)在标签style中使用转换后的base64编码。这种方法实现了背景图处
2025-07-03 15:38:44
676
原创 uniapp微信小程序css中background-image失效问题
【摘要】在uniapp开发微信小程序时，发现class样式中的background-image失效。经排查，需将图片转为base64格式并在标签中直接使用。解决方案：1)安装image-tools工具；2)通过pathToBase64转换图片路径；3)在view标签的style属性中设置背景图，需包含width/height和background相关属性。注意微信小程序仅支持标签内联样式实现背景图效果，不支持class样式定义。
2025-07-03 11:18:20
1306
原创 微信小程序使用秋云ucharts echarts
微信小程序中使用uCharts图表组件指南 摘要：本文介绍了在微信小程序项目中集成uCharts图表组件的完整流程。通过HBuilderX插件市场下载最新版uCharts组件（需看广告获取），导入项目后即可使用。示例展示了折线图实现方法，包括模板配置、数据格式和样式调整。组件支持全局参数配置，可灵活修改图表样式。数据获取采用模拟延时方式，最终效果为多系列动态折线图，适用于各类数据可视化场景。
2025-07-01 17:34:39
1177
原创 npm(或pnpm)时报：证书过期 certificate has expired问题
拉芋道管理系统安装依赖时出现证书过期问题，更改镜像源仍无法解决。解决方案：1) 尝试切换镜像源为http://registry.cnpmjs.org或http://registry.npm.taobao.org；2) 如仍无效，可取消SSL验证，执行命令npm config set strict-ssl false。两种方法均能有效解决证书验证导致的安装失败问题。
2025-06-25 16:59:04
401
原创 分页器封装
摘要：本文介绍了一个基于Element UI的分页组件二次封装方案。封装后的Pagination组件通过props接收总条数(total)、当前页(page)、每页条数(limit)等参数，并支持自定义分页布局(layout)、每页条数选项(pageSizes)等配置。组件内部使用v-model双向绑定分页参数，通过emit触发pagination事件传递分页变更。使用示例展示了如何通过changePage回调处理分页变化并重新获取数据。该封装简化了分页功能实现，提高了代码复用性，支持自动滚动和响应式设计，
2025-06-25 11:35:55
186
原创 vue项目中引入别的特定字体
摘要 在项目开发中，经常需要引入特定字体。本文介绍了将自定义字体应用到项目的简易方法：首先将字体文件放入项目目录；然后在全局文件（如App.vue）中引用字体；最后在具体文件中通过HTML标签或CSS样式使用该字体。这种分步操作确保字体在整个项目中统一应用，既简单又高效。
2025-06-25 09:55:28
456
原创 vue项目运行时去除控制台警报
在运行vue项目是，控制台有时候会有一些黄色警报，一般时候并不是很多，这个时候在控制台打印一些东西也还是可以看到的，但是有时候，比如在页面加计时器的时候，这个时候的警报会递增，在控制台打印的东西根本看不到。如下图，这个时候警报会一直递增，根本看不到自己在控制台打印的一些东西。
2025-06-24 17:30:52
538
原创 echarts嵌套圆环内外圆环颜色同色系
本文介绍了一种实现嵌套圆环颜色联动的方法。通过自定义同色系颜色数组，在ECharts中使用itemStyle的color函数动态设置内外圆环颜色。外层圆环采用自增标记依次取色，内层圆环固定父级颜色。解决方案包含颜色数组定义、圆环初始化、鼠标悬浮高亮交互等关键代码。该方法解决了嵌套圆环颜色协调问题，实现了视觉统一的同色系效果。
2025-06-20 12:15:10
544
原创 使用u-swipe-action在手机上上下滑动失效的问题
在uni-app开发中，使用uView组件库2.0.31版本时遇到滑块组件导致页面无法上下滚动的问题。解决方案是改用uni-app官方扩展组件uni-swipe-action：1)从uni-app官网下载最新版本并导入HBuilderX；2)在页面中使用uni-swipe-action组件实现滑动操作功能；3)通过配置right-options定义右侧滑动按钮样式和事件。该方法成功解决了原组件导致页面滚动失效的问题，同时实现了美观的滑动操作效果。
2025-06-18 11:42:34
647
原创 echarts嵌套圆环图内外联动
在嵌套圆环中一般内外圆环都有一定的关联，那么可能就需要一些联动操作，这样看着，别人才会觉得这个嵌套圆环内外才是有关联的，如下面的视频一样嵌套圆环内外联动。
2025-06-15 09:06:09
424
原创 模板字符串使用点击事件【VUE3】
1.在字符串里的点击事件是原生的onclick2.原生的函数getDownUp是定义在window全局对象上的然后使用这个定义好的点击事件 const goDetails=(val)=>{......}
2025-06-12 17:16:37
504
原创 vue封装的echarts组件被同一个页面多次引用只显示一个的问题
当封装的Echarts组件在同一页面重复引入时，如何避免数据覆盖的问题。关键在于将组件中的id更改为ref，并在初始化时使用refs来获取元素，从而实现多个Echarts实例的独立。
2025-06-11 14:40:10
465
原创 高德地图多标记点点击显示信息窗体
摘要：本文介绍了在Vue项目中集成高德地图并实现多点标记功能的方法。首先需要获取高德开发者key，然后在index.html中引入高德地图API。通过Vue组件实现地图容器，利用AMap.Map创建地图实例，并使用AMap.Marker添加多个标记点。每个标记点可绑定点击事件，触发自定义信息窗口显示详细内容（包括标题、文本和图片）。文章详细说明了信息窗口的样式定制和关闭功能实现，提供了完整的代码示例和样式设置，帮助开发者快速实现地图多点标记交互功能。
2025-06-10 09:40:54
586
原创 vue3使用和风天气插件
在一些项目中一般有些需要一些显示天气的预报，特别是在农业类的大屏中，一般需要展示未来几天的天气预报，最好还是自带图标的天气插件，今天就说一下再vue3中使用和风天气插件。比较好用。首先需要注册为开发者，下面是链接。
2025-06-06 19:00:28
1320
原创 Ctrl+鼠标滚动阻止页面放大/缩小
一般在我们做大屏的时候，不希望Ctrl+鼠标上下滚动的时候页面会放大/缩小，那么在有时候，又不希望影响到别的页面，比如说这个大屏是在另一个管理后台中，那么，在管理后台Ctrl+鼠标上下滚动是可以缩放的，但是，跳转到大屏时候是不希望缩放的。这时候我们可以将阻止缩放函数放在大屏的页面中。
2025-05-22 15:05:52
607
原创 多行文字无限滚动，鼠标移入停止，移出继续
在做一些大屏时，会有一些信息，这些信息有时候有点多，但是可展示区域没那么大，这时候就需要做一些文字信息的滚动显示。就像下面那个视频一样：多行文字滚动但是有时候信息可能又有些少，不用滚动就可以展示完全，这时候就不需要滚动展示。就像下面那个视频一样：页面能展示全就不滚动。
2025-05-22 14:31:14
633
原创 uniapp 震动功能实现
UniApp震动功能实现方案摘要：UniApp提供短震动(15ms)和长震动(400ms)两种反馈方式，分别适用于轻量交互和重要提示场景。需在manifest.json配置权限，注意平台兼容性(H5不支持)。建议封装工具函数统一管理，包含成功/失败回调，并合理控制使用场景避免过度震动。示例代码展示了如何通过按钮触发两种震动效果，同时处理可能出现的异常情况，为移动应用提供触觉反馈增强用户体验。
2025-05-07 19:02:11
1148
原创 uniapp使用mixin分享到朋友圈
在uniapp的项目中，需要每个页面都可以分享到朋朋友圈，那么一个页面一个页面写太麻烦了，可以使用mixin挂全局。
2025-05-07 18:15:30
747
原创 VUE+ElementUI 使用el-input类型type=“number” 时，取消右边的上下箭头
在项目中有时候需要输入框的type=“number”，这个时候，输入框的右边就会出现两个按钮，这两个按钮可以递增/递减，但是这样输入框看上去就不太美观，就需要将其隐藏。
2025-05-07 14:39:07
1647
原创 Vue3中到达可视区域后执行
在项目中有时候需要显示一些动态效果，但是如果页面过长刷新页面的时候有些效果在没看到的时候就会执行，那么能滚动到那个区域的时候哪些动态效果就在没看到的时候就已经执行过了，那怎么才能让后滚动到可视区域的时候才执行呢？在Vue 3中，要判断一个元素是否到达可视区域，你可以使用几种不同的方法。最常见和直接的方法是利用Intersection Observer APIIntersection Observer是一个非常强大的API，可以自动“观察”目标元素是否进入其祖先元素或顶级文档视口的可见区域。
2025-04-30 16:57:48
802
原创 css 数字从0开始增加的动画效果
在有些时候比如在做C端项目的时候，页面一般需要一些炫酷效果，比如数字会从小值自动加到数据返回的值css 数字从0开始增加的动画效果。
2025-04-30 16:31:00
1229
原创 hover时动画震动效果
在有的相关目中特别是在C端一般都要求做的炫酷一些，这就需要一些简易的动画效果，这里就弄了一个简易的震动的效果如下视频所示让图标一大一小的震动视频。
2025-04-30 16:12:55
526
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人