- 博客(147)
- 收藏
- 关注
原创 Vue Router 重大更新后,params 传参失效?三种替代方案深度解析
Vue Router传参方式更新解析:告别params,拥抱新方案 随着Vue Router版本更新,传统params传参方式失效,本文深度解析三种替代方案: query传参:简单直观,参数显示在URL中,适合非敏感数据; state传参:利用History API,参数不显示在URL,但刷新可能丢失; Pinia/Vuex传参:适合复杂数据共享,不受页面刷新影响。 文章对比了各方案的优缺点,并给出最佳实践建议:简单公开数据用query,隐私数据用state,复杂共享数据用状态管理库。开发者应根据实际场景选
2025-08-05 09:59:29
971
原创 【Git 分支整合的艺术:岔路与归途的抉择 ——merge 与 rebase 深度解析】
git merge 与 git rebase 作为两种主流的分支整合工具,看似功能相似,却隐藏着对代码历史截然不同的哲学思考。
2025-08-01 15:38:46
690
原创 Vue3 中 toValue 与 unref 深度解析:异同、场景与最佳实践
Vue3中的toValue和unref都是响应式数据解包工具,但存在关键差异:unref仅解包ref对象,而toValue在unref基础上增加了对函数类型的支持,会自动执行函数并返回结果。toValue更适合处理动态计算和多种输入类型的场景,如组合式函数参数标准化;unref则在简单解包和性能敏感场景更具优势。开发者需注意两者对reactive对象和函数参数的不同处理方式,根据实际需求选择合适工具。
2025-07-30 16:36:32
1075
原创 【Vue3 中 computed 深层数据响应性失效问题解析与解决方案】
本文分析了Vue3组合式API中computed计算属性处理深层数据时出现的响应性失效问题。通过实际项目案例,发现当通过JSON.parse转换Pinia存储数据时,computed无法追踪深层数据变化导致页面不更新。解决方案是改用ref定义响应式变量并在onMounted中赋值,确保数据从开始就是响应式的。关键经验包括:computed更适合处理简单数据转换,复杂数据源应优先转换为响应式对象,处理深层变化时需使用Vue响应式API。这有助于开发者避免类似响应性问题,提高开发效率。
2025-07-29 10:24:35
675
原创 【总走神、效率低?成人必学的 6 大专注力训练法,7 天改善分心习惯】
成人专注力提升方案基于生理、环境及认知多维度设计。生理层面强调规律作息、低GI饮食及有氧运动;环境管理需精简工作区并控制数字干扰;认知训练推荐正念冥想和番茄工作法;任务管理建议拆解目标并可视化进度;心理调整需接纳分心并管理压力。每日从15分钟冥想和2个番茄钟开始,逐步强化"专注肌肉"。该方案通过系统训练将分心转化为专注力锻炼,实现可持续提升。
2025-06-19 09:54:11
759
原创 【React基础二】事件绑定、组件props、条件渲染、列表、refs、组件声明周期
事件绑定、组件props、条件渲染、列表、refs、组件声明周期
2023-12-17 21:22:17
423
原创 【React基础一】React简介和特点、虚拟DOM、JSX、项目搭建、组件与State状态
React简介和特点、虚拟DOM、JSX、项目搭建、组件与State状态
2023-12-17 21:14:47
548
原创 【Vue+Mysql实现前端对接数据库】
Vite + Vue3 工程化环境下,需要在 package.json 中配置。注意:Node 14+ 版本支持 CommonJS 和 ESM 两种规范。当然你也可以使用 CommonJS 规范通过。导入模块,这样项目中就存在两种规范的写法了。其它 api 文件配置参考 login.js。,且后端文件后缀需要由。
2023-12-17 20:52:05
2021
原创 【TS篇二】变量、数据类型、接口、解构赋值
TypeScript会假设你,程序员,已经进行了必须的检查。需要注意的是,我们传入的对象参数实际上会包含很多属性,但是编译器只会检查那些必需的属性是否存在,并且其类型是否匹配。在TypeScript里,接口的作用就是为这些类型命名和为你的代码或第三方代码定义契约。基本原则就是如果一个变量不需要对它写入,那么其它使用这些代码的人也不能够写入它们,并且要思考为什么会需要对这些变量重新赋值。元组类型允许表示一个已知元素数量和类型的数组,各元素的类型不必相同。,因为它使你的代码更严谨,可以极大的减少出错的几率。
2023-11-03 20:12:41
1985
原创 【TS篇一】TypeScript介绍、使用场景、环境搭建、类和接口
TypeScript 是 JavaScript 的强类型版本。然后在编译期去掉类型和特有语法,生成纯粹的 JavaScript 代码。由于最终在浏览器中运行的仍然是 JavaScript,所以 TypeScript 并不依赖于浏览器的支持,也并不会带来兼容性问题。TypeScript 是 JavaScript 的超集,这意味着他支持所有的 JavaScript 语法。并在此之上对 JavaScript 添加了一些扩展,如 class / interface / module 等。
2023-11-03 20:06:10
1057
原创 【ES6知识】Promise 对象
Promise对象用于表示一个异步操作的最终完成(或失败)及其结果值。是异步编程的一种解决方案(可以解决回调地狱问题)
2023-09-28 08:53:28
790
原创 【HTML5高级第三篇】drag拖拽、音频视频、defer/async属性、dialog应用
drag拖拽、音频视频、defer/async属性、dialog元素应用
2023-09-07 10:16:06
1134
原创 【HTML5高级第二篇】WebWorker多线程、EventSource事件推送、History历史操作
WebWorker多线程、EventSource事件推送、History历史操作
2023-09-06 11:00:27
1045
原创 【HTML5高级第一篇】Web存储 - cookie、localStorage、sessionStorage
Web存储 - cookie、localStorage、sessionStorage
2023-09-04 10:35:20
2391
原创 【Vue3 知识第七讲】reactive、shallowReactive、toRef、toRefs 等系列方法应用与对比
reactive、shallowReactive 等系列方法应用与对比
2023-09-04 10:20:31
2132
原创 【Vue3 知识第六讲】ref、 shallowRef、unref、isRef 等系列知识应用
ref、 shallowRef、unref、isRef 等系列知识应用
2023-09-04 10:16:21
3746
原创 【Vue3 知识第二讲】Vue3新特性、vue-devtools 调试工具、脚手架搭建
Vue3新特性、vue-devtools 调试工具、脚手架搭建
2023-09-01 11:08:13
2840
原创 【ES新特性三】Object 原型、原型链相关方法
此方法为 Object.prototype 原型方法,Object.prototype 作为任意对象在原型链上的顶级原型对象,在 JS 中定义的任意一个对象(自定义对象、数组对象等都可以调用子方法)。**Object.getOwnPropertyNames()**方法返回一个由指定对象的所有自身属性的属性名(包括不可枚举属性但不包括 Symbol 值作为名称的属性)组成的数组。方法会返回一个由一个给定对象的自身可枚举属性组成的数组,数组中属性名的排列顺序和正常循环遍历该对象时返回的顺序一致。
2023-08-30 09:35:41
1647
原创 【ES5新特性二】新增对象属性特性
方法返回指定对象上一个自有属性对应的属性描述符。(自有属性指的是直接赋予该对象的属性,不需要从原型链上进行查找的属性)ES5中定义了一个属性描述符对象(property descriptor),这个对象属性和他们所描述的属性特性是同名的。方法会直接在一个对象上定义一个新属性,或者修改一个对象的现有属性,并返回此对象。方法直接在一个对象上定义新的属性或修改现有属性,并返回该对象。方法用来获取一个对象的所有自身属性的描述符。
2023-08-30 09:30:38
498
hexo实现个人博客网站
2023-08-09
vue3 表格组件封装复用
2023-02-27
微信小程序之防饿了么点餐系统
2023-03-09
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人