- 博客(23)
- 收藏
- 关注
RSS订阅原创 主题切换兼容IE浏览器需求实现
本文介绍了一种兼容IE浏览器的主题切换方案。针对IE不支持CSS变量的问题，采用双轨制实现：现代浏览器使用CSS变量动态切换，IE浏览器通过动态创建样式表实现。
2025-10-20 15:52:14
589
原创 获取不到某cookie值问题
HttpOnly 字段 cookie的httponly属性。若此属性为true，则只有在http请求头中会带有此cookie的信息，而不能通过 document.cookie 来访问此 cookie。窃取cookie内容，这样就增加了cookie的安全性。如果确实需要通过JavaScript访问cookie，需要与后端开发者协商，确保在设置cookie时不要添加HttpOnly属性。想通过document.cookie来获取某cookie值，发现浏览器有cookie，但是无法获取到。
2025-09-02 14:31:32
313
原创 vue报错：Vue received a Component that was made a reactive object.
Vue组件被设为响应式对象时会产生性能警告。解决方法是将动态组件用shallowRef替代ref
2025-07-25 10:12:59
328
原创 vue项目接口请求规范
本文总结了基于Axios的HTTP请求封装方案。主要内容包括：1)通过拦截器统一处理请求头、错误码和加载状态；2)采用模块化方式管理API接口，按业务分类；3)配置环境变量区分不同环境；4)实现全局错误处理和加载控制；5)解决跨域问题。方案优化了请求参数规范、命名规则，并提供了缓存机制、并发请求优化等扩展功能。这种封装方式避免了重复代码，提升了开发效率和用户体验，同时具备良好的可维护性和扩展性。
2025-07-21 14:55:44
1140
原创 vue3内置组件的个人总结
Vue3内置组件是框架提供的核心功能组件，主要包括：1）Transition/TransitionGroup组件用于实现元素状态变化的动画效果，支持单个元素和列表动画；2）Teleport组件可将内容渲染到DOM任意位置，解决布局限制问题；3）Suspense处理异步组件加载状态；4）KeepAlive实现组件缓存。这些内置组件封装了常见开发场景的复杂逻辑，能有效减少重复代码、优化渲染性能，提升开发效率和用户体验。合理使用这些组件可以简化动画实现、解决布局穿透问题，并优化应用性能表现。
2025-07-21 14:39:32
911
原创 Vue 项目中路由管理的通用规范和业务实现约定
本文总结了Vue项目中vue-router的最佳实践方案，主要包含：1）路由模块化分层架构设计，将静态路由、动态路由分离管理；2）两种动态路由实现方案（前端权限过滤和后端动态注入）及其适用场景；3）路由使用规范，包括命名规则、参数传递、懒加载等；4）性能优化策略如路由缓存、层级控制等。文章详细介绍了如何通过路由守卫实现权限控制，并对比了不同方案的优缺点，为不同规模项目提供了选型建议。
2025-07-18 14:17:50
1090
原创 vue项目打包后部分图片加载失败问题总结
Vue项目打包后动态背景图片加载失败的问题，主要由于webpack默认将10K以下图片转为base64格式，而大图片路径处理不当导致。解决方法：1）在vue.config.js中调整limit值控制图片转base64的阈值；2）修改publicPath配置资源加载路径。需注意base64虽能减少HTTP请求，但过大图片转base64会导致JS文件臃肿，影响加载性能和用户体验。合理设置转换阈值是关键，小图片适合转base64，大图片应保持原格式通过正确路径加载。
2025-04-02 13:53:10
756
3原创 Vue3项目动态多表单提交与表单验证功能实现
本文介绍了在Vue中动态管理多个表单验证的实现方法。首先在setup函数中定义响应式的formRefs对象来存储表单引用，通过v-for动态绑定每个表单实例。然后定义通用的验证规则和checkForm函数，该函数返回Promise处理验证结果。最后通过validateAllForms函数遍历所有表单，使用Promise.all批量验证，确保所有表单验证通过后才执行提交操作。这种方法有效解决了动态表单的批量验证问题，并提供了清晰的异步处理机制。
2025-03-27 15:50:51
487
原创 前端如何实现序列帧动画
摘要：本文介绍了前端实现序列帧动画的多种方法，包括CSS动画、JavaScript控制、Canvas绘制、SVG动画和WebGL。重点分析了Canvas绘制方法，详细说明了初始化、加载帧图片和绘制动画的步骤。文章指出，CSS和JavaScript适合简单动画，而Canvas、SVG和WebGL适用于复杂场景。通过对比不同技术的实现方式，帮助开发者根据项目需求选择合适的方法来实现高性能序列帧动画。（150字）
2024-12-19 14:06:13
1964
原创 vue3项目开发总结
这个Vue组件模板页面通过组件化、插槽机制、响应式数据管理和自定义参数传递等方式，实现了一个功能丰富、灵活可复用的列表查询页面。在实际项目中，可以根据具体需求对组件进行进一步的优化和扩展。2、自定义hook一个利用 Vue3 的组合式 API 来封装和复用具有状态逻辑的函数。通过封装有状态的函数，极大提高了组件的编写效率和维护性。提取一个用于获取码表数据并将其存储在响应式对象中的hook在项目的某个文件夹中（例如src/hooks），创建一个新的 JavaScript文件。
2024-10-29 09:45:21
980
原创 vue2项目升级到vue3总结
为了更快更准确的将vue2项目升级至vue3，因此在本次的升级中代码结构保持不变，后续新写的页面再可以采用组合式API的写法。（1）全局搜索 slot-scope="scope" 直接全局替换 成 #default="scope"9、分页组件中的current-page.sync，修改为 v-model:current-page。elsub-menu 改成 el-sub-menu，包括样式里classname中的。5、el-dialog、el-drawer修改。三、修改配置文件及vue全局api。
2024-05-15 16:13:43
3808
原创 折线图线条过多优化方案
2. 节点变化折线图：将折线图拆分，各节点的流量变化使用单独一个曲线展示。当节点数>4时，每四个节点展示一行（每行展示的个数可以配置）1. 发布流量走势柱状图：当生产环境和灰度环境流量分布差距较大时，会出现某个环境下的柱形图普遍很低，无法明显的展示流量走势。1. 发布流量走势柱状图：柱形图使用两个纵坐标，灰度环境和生产环境流量数分别决定两个纵坐标的刻度值分布，按照各自的坐标展现柱形的高度。2. 节点变化折线图：在几十个节点的情况下折线图中线条比较乱，不方便观察各节点的变化趋势。
2023-09-26 16:36:40
1705
原创 基于Vue的Cron表达式
例如：在 DayofMonth使用5W，如果5日是星期六，则将在最近的工作日：星期五，即4日触发。例如：子表达式（天（星期））可以为 “MON-FRI”，“MON，WED，FRI”，“MON-WED,SAT”（5）,：表示列出枚举值。例如：在Minutes域使用5,20，则意味着在5和20分每分钟触发一次。在子表达式（分钟）里的“3/20”表示从第3分钟开始，每20分钟（它和“3，23，43”）的含义一样。因此，“*”在子表达式（月）里表示每个月的含义，“*”在子表达式（天（星期））表示星期的每一天。
2023-09-26 16:31:23
1348
原创 idea配置tomcat（解决修改jsp不能实时更新页面问题）
3、如果你的工程中没有 Update classes and resources 这个选项，只有如下选项那么请接着往下看，因为我开始也是这样的，在这种情况下你更新后只能更新classes文件中的变动，并不能更新静态文件中的变动。出现这种选项情况的原因是因为你在Deployment的选项中使用的是先将工程打成war包然后再去运行的。先remove当前工程，再次添加，添加的时候选择Artiface。你可以根据自己的需求进行设置，我这里两个都有设置。展开部署(相当于将资源文件进行展开后进行部署)
2023-09-26 16:26:18
2387
原创 阿里云速搭--功能试用体验
本产品提供大量预制的应用架构模板，同时也支持自助拖拽方式定义应用云上架构，支持大量阿里云服务的配置和管理，您可以方便地对云上架构方案的成本、部署、运维、回收进行全生命周期的管理。③ 在导出价格清单对话框中，向您展示应用中各资源消费详情和成本占比，使您对应用架构的费用情况有综合的了解，确认无误，单击下一步：部署清单。⑤ 若校验失败，根据提示信息修改资源配置，修改完后，重新保存应用，然后再次单击菜单栏下的应用 > 部署应用，直至校验成功为止。资源：资源探查：自动探查阿里云已保有资源，生成架构图。
2023-09-26 16:23:56
303
原创 前端性能优化问题汇总
当 <link>标签的 href 属性为空，或 <script>、 <img>、 <iframe>标签的 src 属性为空时，浏览器在渲染的过程中仍会将 href 属性或 src 属性中的空内容进行加载，直至加载失败，这样就阻塞了页面中其他资源的下载进程，而且最终加载到的内容是无效的，因此要尽量避免。顾名思义，并没有实际上的提升速度，而是优化了用户体验，我们可以采用骨架屏、懒加载、合理loading，防抖、节流（减少不必要的请求）等方式让用户的等待变得舒服。多次使用到的公共代码进行提取，打包成公共模块。
2023-09-26 16:20:41
324
原创 vue项目webpack3迁移到webpack4总结
webpack4不支持extract-text-webpack-plugin，需要安装mini-css-extract-plugin代替，并配置 css-loader。1、extract-text-webpack-plugin替换成mini-css-extract-plugin。2、升级webpack-dev-server。在webpack升级的同时，对应的许多依赖也需要相应的进行升级。1、升级webpack版本，并安装webpack-cli；二、 升级npm run dev。
2023-09-26 16:17:49
466
原创 Vue2与 Vue3的区别
Vue3相比Vue2的主要区别：生命周期钩子名称变更（如添加on前缀），引入setup函数；数据绑定改用Proxy替代Object.defineProperty；支持多根节点模板；新增组合式API；父子传参使用setup(props,context)；指令与插槽语法更新（如v-slot替代slot）。Vue3在性能优化（Proxy监听）、代码组织（组合式API）和开发体验（碎片支持）等方面有显著改进，同时保持了向下兼容性（支持选项式API）。
2023-09-26 16:12:29
630
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人