- 博客(129)
- 收藏
- 关注
RSS订阅原创 [Vue 3 从零到上线]-第九篇：更美更强——引入 UI 库与网络请求 (Axios)
本文介绍了前端开发中组件库、网络请求和跨域处理的核心技术要点。主要内容包括： 组件库的价值：Element Plus 不仅提供美观UI，更确保了交互一致性、处理兼容性问题并封装复杂逻辑，建议通过按需引入优化性能。 Axios封装：展示了如何通过请求/响应拦截器统一处理Token、错误提示等，避免重复代码，提升开发效率。 TypeScript类型安全：通过定义接口类型确保API数据结构的正确性，在编译阶段捕获潜在错误。 跨域解决方案：使用Vite代理配置绕过浏览器同源策略限制，实现本地开发环境与后端API的无
2026-03-03 15:43:35
747
原创 [Vue 3 从零到上线]-第八篇：全局大管家——Pinia 状态管理
Vue 状态管理：从 Vuex 到 Pinia 的演进 摘要：本文对比了 Vuex 和 Pinia 两种状态管理方案。Pinia 作为 Vue 3 官方推荐库，优势在于：1) 完美支持 TypeScript 类型推断；2) 简化数据流，去除 mutations 中间层；3) 采用 Composition API 风格，降低学习成本。文章详细展示了 Pinia 的核心三要素（State、Getters、Actions）和典型用法，并指出常见误区（如响应式解构问题）及其解决方案。最后介绍了数据持久化插件，并给出
2026-03-02 16:55:07
550
原创 [Vue 3 从零到上线]-第七篇：单页应用的导航——Vue Router 路由控制
本文介绍了Vue路由的基本概念和使用方法。路由是一套映射规则，将URL路径对应到特定组件。文章详细说明了路由三要素：1)定义路由表，包含路径与组件映射；2)在main.ts中安装路由系统；3)在App.vue中使用<router-link>导航和<router-view>显示组件。还讲解了动态路由参数获取方法，以及编程式导航实现页面跳转的技巧。路由懒加载等性能优化方案也有提及。全文提供了TypeScript代码示例，适合Vue3开发者快速掌握路由基础。
2026-02-28 09:39:02
364
原创 [Vue 3 从零到上线]-第六篇：表单与双向绑定——让用户与网页对话 (v-model)
本文深入解析了Vue中的v-model双向绑定机制。首先揭示了v-model作为"语法糖"的本质，它由数据绑定(:value)和事件监听(@input)两部分组成，实现了数据在JS和HTML之间的双向流动。文章澄清了v-model并非违反Vue单向数据流原则，而是通过自动处理emit信号保持了数据流的清晰性。同时详细介绍了在组件中使用v-model的高级技巧，包括默认的modelValue绑定、多v-model绑定，以及.lazy、.trim、.number等修饰符的优化作用。最后展示了
2026-02-27 14:18:58
506
原创 [Vue 3 从零到上线]-第五篇：数据的秘密通道——父子组件通信 (Props 与 Emits)
本文深入讲解了Vue 3中的组件化思维与单向数据流设计。核心要点包括：1）单向数据流原则，数据通过props从父组件流向子组件，子组件通过emits事件通知父组件修改数据；2）使用TypeScript严格定义props和emits的类型，提高代码可靠性和开发体验；3）组件通信"四步走"策略：确定数据源头、定义props、设计emits事件、闭环处理逻辑；4）常见避坑指南，如避免直接修改props、谨慎解构props等。文章通过实例代码演示了父子组件间的数据传递和事件通信机制，为后续学习v
2026-02-25 10:06:59
580
原创 [Vue 3 从零到上线]-第四篇：组件化思维——把网页像积木一样拆解
本文介绍了Vue 3组件化开发的核心概念和实践方法。主要内容包括：1) 组件化设计的高内聚低耦合原则；2) <script setup>语法糖的自动注册特性；3) 插槽(Slots)的使用技巧；4) TypeScript在组件开发中的应用；5) 实战代码重构示例；6) 组件拆分的黄金法则。文章强调组件化开发的可复用性、可维护性和可读性优势，并预告了下篇将讲解组件间的数据通信机制(Props和Emits)。通过具体代码示例，帮助开发者掌握Vue 3组件化开发的最佳实践。
2026-02-24 09:17:12
663
原创 [Vue 3 从零到上线]-第三篇：网页的指挥官——指令系统 (v-if, v-for, v-bind, v-on)
本文深入讲解了Vue 3中的条件渲染(v-if与v-show)、列表渲染(v-for)、属性绑定和事件处理等核心指令。重点分析了v-if和v-show的内存与性能权衡，强调了v-for中key值的重要性，并提供了TypeScript环境下的最佳实践。文章还详细介绍了动态class绑定和事件修饰符的使用技巧，最后通过一个完整的TaskList示例展示了这些指令的综合应用。作者指出，掌握这些声明式指令可以帮助开发者从"操作DOM"转向"管理数据"的思维方式，为后续学习组件
2026-02-12 16:38:06
750
原创 [Vue 3 从零到上线]-第二篇：神奇的魔法盒——响应式基础 (ref 与 reactive)
本文深入解析Vue 3响应式原理与最佳实践。核心观点：Vue 3通过Proxy实现数据响应式，当数据变化时自动更新相关视图。文章对比了ref和reactive的使用场景，推荐优先使用ref以保证代码健壮性。在TypeScript环境下，详细演示了如何通过泛型约束响应式数据类型，并提供三种进阶用法。实战部分展示了一个标准的Vue 3 + TS响应式组件实现，包含数据模型定义、业务逻辑处理和模板渲染。最后针对新手常见问题作出解答，强调模板中自动解包ref.value的特性，并预告后续将讲解指令系统。全文以&qu
2026-02-11 11:25:05
547
原创 [Vue 3 从零到上线]-第一篇：初出茅庐——环境搭建与第一个 Vue 页面
本文介绍了使用Vue 3、TypeScript和Vite搭建前端开发环境的核心要点。首先解释了Vue 3作为框架的优势、TypeScript的类型检查功能以及Vite的高效构建能力。然后详细说明了项目创建过程和环境配置逻辑，重点解析了Vue单文件组件的三部分结构：TypeScript逻辑层、HTML模板层和scoped样式层。文章还阐述了从代码编写到浏览器运行的完整流程，并指出了项目目录中的关键文件。最后预告了下篇将深入讲解Vue 3的响应式系统。全文以生动比喻帮助理解技术概念，适合初学者快速掌握现代前端开
2026-02-10 17:19:52
567
原创 [antd]有两个Form组件，通过一个状态来切换，初次渲染的Fform拿不到数据
【代码】[antd]有两个Form组件，通过一个状态来切换，初次渲染的Fform拿不到数据。
2024-04-09 10:10:13
459
原创 【SSH】Linux常用命令
1.1.2 返回上两级目录1.1.3 进入某个目录下1.1.4 返回上次所在目录1.1.5 进入某目录1.1.6 返回根目录1.1.7显示目录路径1.2 查看（ls）选项选择意义-a显示所有文件及目录（包括以“.”开头的隐藏文件）-l /-lh/-lrt使用长格式列出文件及目录信息-r将文件以相反次序显示(默认依英文字母排序)-t根据最后的修改时间排序-A同-a，但不列出’.'当前目录及“…”(父目录)-S根据文件大
2024-01-24 14:47:48
5015
原创 【node】关于npm、yarn、npx的区别与使用
因此，npx yarn install 的效果与直接运行 yarn install 是一样的。通常情况下，你可以直接使用 yarn install 来安装项目依赖，而不需要额外使用 npx。npx yarn install 的作用是使用 npx 命令来运行 yarn install，实际上它等同于直接运行 yarn install。： npx 通常用于执行项目依赖中的可执行文件，适用于需要一次性执行某个命令而无需全局安装的情况。yarn install: 是 yarn 命令的一部分，用于安装项目的依赖。
2024-01-24 14:45:37
1692
原创 【git】关于git二三事
Git是分布式版本控制系统，每个人的电脑就是一个完整的版本库。那多个人如何协作呢？比如说自己在电脑上改了文件A，其他人也在电脑上改了文件A，这时，你们两之间只需把各自的修改推送给对方，就可以互相看到对方的修改了。主要工作流程：Workspace：工作区Index / Stage：暂存区Repository：仓库区（或本地仓库）Remote：远程仓库。
2023-12-10 22:20:44
1305
原创 【React】03-React面向组件编程2
现在使用会出现警告，下一个大版本需要加上UNSAFE_前缀才能使用，以后可能会被彻底废弃，不建议使用。2.React组件中包含一系列勾子函数(生命周期回调函数), 会在特定的时刻调用。3.componentWillUnmount：做一些收尾工作, 如: 清理定时器。3.我们在定义组件时，会在特定的生命周期回调函数中，做特定的工作。需求：验证虚拟DOM Diffing算法的存在。1.组件从创建到死亡它会经历一些特定的阶段。生命周期的三个阶段（旧）生命周期的三个阶段（新）
2023-10-13 17:13:07
644
原创 【React】02-React面向组件编程
2.如果A类继承了B类，且A类中写了构造器，那么A类构造器中的super是必须要调用的。2.如果A类继承了B类，且A类中写了构造器，那么A类构造器中的super是必须要调用的。1.类中的构造器不是必须要写的，要对实例进行一些初始化的操作，如添加指定属性时才写。1.类中的构造器不是必须要写的，要对实例进行一些初始化的操作，如添加指定属性时才写。 3.类中所定义的方法，都放在了类的原型对象上，供实例去使用。3.类中所定义的方法，都放在了类的原型对象上，供实例去使用。
2023-10-13 17:11:23
682
原创 【clojure】cljs的各种参数判断
negate-value函数接受一个名为value的参数，并使用not函数对value进行取反操作。函数只能判断参数是否为true，不能判断其他值是否为真，比如非空字符串或非零数字。如果为空，则输出提示信息"值为空，请提供有效的参数"，并使用。函数可以将集合转化为一个序列（sequence），如果集合为空，则返回。是否为空，如果为空，则输出提示信息"所有值都已处理完毕"。如果你需要判断其他类型的值是否为空，可以使用相应的函数，如。，如果参数是true，则返回true，否则返回false。
2023-09-12 18:45:00
567
原创 【Electron】electron与cljs的处理
实现效果:前言：如何用cljs的方式，编写electron应用，可以实现多窗体应用要使用ClojureScript（CLJS）编写一个 Electron 应用程序，并实现多窗体功能，您可以按照以下步骤进行操作：设置开发环境：安装 Node.js：确保您的计算机上安装了 Node.js，因为 Electron 依赖于它。安装 Leiningen 或 Boot（如果您使用的是 Clojure 项目）。创建项目：在您选择的项目文件夹中创建一个新的 ClojureScript 项目。
2023-09-12 09:23:05
800
原创 【clojure】re-frame的学习笔记01
而且，不，重新框架不提供标准效果处理程序，因此您需要自己编写它们，然后注册它们。map参数中，但当前的“应用程序状态”是世界中总是需要的一方面，并且默认情况下在密钥中可用。刚刚删除的项目生成hiccup，但除此之外，“这次”计算的hiccup将与“上次”相同。一个变异的、有效的行为，这就是效果处理程序所做的事情，他们改变"the world"。返回的映射的每一个键都标识一种方法，并且该键提供了更多详细信息，返回。更多内容将在后面的教程中介绍。的，它是用向量参数调用的，该向量的第一个元素是一个查询 ID。
2023-09-09 20:28:55
809
原创 【clojure】02-clojure中的方法1
如果你想在vector中找到最大值，需要使用apply。个人理解应该是求余 div对num求余。取coll，从第n个之后的。
2023-09-03 12:34:42
277
原创 【clojure】入门篇-01
;定义一个symbol的a设置的值为hello，a值不可变;;定义局部的,直接返回了aa)ps:定义之后若要使用该函数名称，需要先执行一遍该定义的内容;;3.定义一个函数;;函数、后面跟的是一个参数列表，;;一个函数出现在列表的第一个元素位置的时候会被求值，这样就执行了这个元素;;给函数起一个名字;;通常使用 defn 函数名 参数列表 函数体。
2023-08-27 15:59:45
1654
原创 【vue】使用系统提示音
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Block List</title> <style> * { margin: 0;
2023-08-16 13:00:57
757
原创 【Java】02--变量与数据类型Scanner
你只需要记住两点：常量：就是一种不会根据环境而改变的数据，例如：圆周率。变量：是一种能够根据不同环境产生不同值的数据，例如：手机电量。在 Java中，我们通过三个元素描述变量：变量类型、变量名以及变量值。在Java中的变量类型又有哪些呢？在JAVA中变量类型大致可以分为两种一种是数值类型，一种是非数值类型，数值类型又分为两种:整形和非整形如图所示：接下来我们就要开始定义变量了，需要四个步骤。确定变量类型取变量名给变量赋初值分号结尾。
2023-06-27 16:45:00
596
原创 【Java】第一阶段--01--关键字标识符
你只需要记住，注释就是：用于注解说明解释程序的文字它最大的作用就是大大的提高了程序的可读性，因为我们如果查看其它程序员编写的代码往往不能一眼看出某一段程序的含义，但是如果给代码加上一段说明性的文字（注释）我们就能很容易理解这一段代码的含义了。JAVA中有哪些注释在JAVA中有三种注释：1.文档注释，2.单行注释，3.多行注释怎么使用注释单行注释：在要要添加注释的代码或文字之前添加 //,即可。多行注释：在需要添加注释的代码或文字之前添加 /,之后添加 /即可。
2023-06-26 16:38:30
270
原创 【vue】element-ui el-table使用v-if来控制列的显示隐藏 出现列位置错乱问题
表格是element-ui通过循环产生的，而vue在dom重新渲染时有一个性能优化机制，就是相同dom会被复用，这就是问题所在，所以，通过key去标识一下当前行是唯一的，不许复用，列唯一，就可以解决。根据需求，当某一项列数据根据某属性等显示隐藏该列，使用v-if进行隐藏后，发现会有随机列位置错乱与数据错乱现象。这是因为在v-for或者v-if切换标签时，多个相同的标签被渲染，如果不添加key来区分则会出现。而原本这些标签每一个都是独立的，于是需要添加key来做区分！
2023-06-25 16:51:56
2181
原创 【vue】解决el-tree或el-table中树形列表懒加载数据改变后不能实时刷新问题以及使用
首先从map中取出刚刚架子啊过子级节点的数据，再用this.$set清空对应父节点的数据，实现视图实时刷新，再通过取出的数据重新加载父节点。//封装一个增删改刷新table数据的方法,组件懒加载数据的节点，data return的maps，及被操作节点的父节点。在使用el-table表格懒加载子级数据，懒加载仅会在第一次展开时加载，后续会使用第一次缓存的数据，而不会重新加载。传入的三个参数分别是：组件懒加载数据的节点，存储的maps数据，被操作节点的。// 保存本次的展开或折叠状态，用于下次判断。
2023-06-25 16:44:02
8571
2
原创 【element】基于若依的基本图片上传，实现复制粘贴上传图片文件，带图片预览功能
【代码】【element】基于若依的基本图片上传，实现复制粘贴上传图片文件，带图片预览功能。
2023-06-16 12:01:39
1498
原创 【vue】elementUI中el-table拖动滚动条的时候固定某一列
写项目的时候有一个需求，就是当el-table的滚动条滑动的时候，可见区域如果没有该列则固定到左侧，由elementUi官方网站可知el-table固定一列的代码如下:fixed为主要的标识头部固定设置的是table的高度。
2023-04-25 18:06:32
5641
原创 【vue】vuex详解
vuex是一个专门为vue.js应用程序开发的状态管理模式+库，它采用集中式存储管理应用的所有组件的状态，并以响应的规则保证状态以一种可预测的方式发生变化。actions类似与mutations，但是actions是通过commit直接提交mutations，它不是直接变更状态，可以包含任意异步操作。mutations 是同步的、actions可以包含任意的异步操作。actions提交的是mutation，而不是直接变更状态、store中的计算属性，类似于组件中的computed。取state中的数据。
2023-04-23 16:31:45
612
原创 【js】js数组对象字符串的相互转化
字符串既可迭代又类似于数组，因此，可以成功地将其转换为字符数组。将这个columns数组存入localstorage中，本来想数组转字符串对象在转字符串可是这样实现不了。) 允许在需要多个元素（如数组文字）的地方扩展诸如字符串之类的可迭代对象。该split方法可能是将字符串转换为字符数组的常用方法，但它不处理采用两个代码单元的字符。通过使用空字符串作为split方法的分隔符，我们可以将字符串转换为字符数组。这是将字符串扩展为字符数组的示例。解构赋值语法可以将数组或可迭代对象中的值解包为不同的变量。
2023-04-20 16:41:56
1354
原创 【js】数组对象相同键名进行合并
but,由以上可知另一个问题，在attrValueArr中会出现相同的键名，因此我们需要在添加时就，判断是否有重复值。
2023-04-13 09:39:17
706
原创 【Echarts】vue项目el-dialog中使用echarts，第一次点击不显示的解决方案
在项目需求中需要点击el-table中的某条数据，显示出该条数据的变化趋势，使用的是echarts4，发现每次点击el-dialog的时候，点击第一次的时候不会显示echarts的内容，但是查看元素的时候发现元素中有存放echarts的盒子，第二次点开虽然显示图表，但是图表挤在一起，页面检查发现宽高只有100px,但是明明已经设置样式宽高100%。
2023-04-12 16:08:28
1883
原创 【vue】vue中下载文件的方法
在浏览器端，实现直接下载文件，就是使用a标签来只想文件的下载地址。window.location.href的本质也是这样，因此在拿到二进制文件对应的Blob对象后，需要为这个Blob对象创建一个指向它的下载地址的URL。前端项目中下载某个地址的文件模块，文件不想放到后端去下载，在文件大小不太大的情况下，可以把文件放在前端项目中，无论开发环境还是生产环境，都能在同样路径下找到那个文件。通过设置responseType为blob，可以直接拿到二进制文件转化为Blob，两种使用 Blob 实现文件下载的方式。
2023-04-11 10:47:35
9994
原创 【vue】vue中的计算属性和监听属性详解
computed（多个变量计算出一个结果）计算属性：依赖于其他属性，并且有缓存，只有它所依赖的属性值发生变化，那么我们的computed才会重新计算，并且支持同步。
2023-03-27 19:07:39
804
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人