- 博客(50)
- 收藏
- 关注
RSS订阅原创 Vite+Vue3.0项目使用ant-design-vue ＜a-calendar＞日期组件汉化
【代码】Vite+Vue3.0项目使用ant-design-vue 日期组件汉化。
2024-04-08 16:22:43
1052
原创 Yarn：JavaScript 项目依赖管理的得力助手
总的来说，Yarn 是一个强大而灵活的 JavaScript 包管理工具，它的出现大大简化了项目开发过程中的依赖管理，让开发者能够更专注于代码的编写与优化。如果你还没有尝试过 Yarn，不妨给它一个机会，相信它会成为你项目开发中的得力助手。
2024-03-29 11:46:20
1082
1
原创 前端中 JS 发起的请求可以暂停吗
在前端中，JavaScript（JS）可以使用XMLHttpRequest对象或fetch API来发起网络请求。然而，JavaScript本身并没有提供直接的方法来暂停请求的执行。一旦请求被发送，它会继续执行并等待响应。尽管如此，你可以通过一些技巧或库来模拟请求的暂停和继续执行。
2023-12-11 11:04:16
170
原创 前端React项目处理并发的最佳实践
因为js是单线程的，所以前端的并发指的是在极短时间内发送多个数据请求，比如说循环中发送ajax。下面一段代码是常规的mount}, [])});}, [])可以看出有很大的性能优化空间和区别，如果在页面渲染时，多个请求没有相互数据依赖性（依赖请求），直接采用并行请求会加快页面中数据展现的时间，这两个demo同时也涉及到事件循环的一些知识。因此也可以在页面中找到一些可优化的请求，转换为并行，对于首屏渲染的优化是有很大帮助的。可以采用处理并发， 当所有promise。
2023-11-09 10:18:23
186
原创 只会Vue? 用两天学会React，这个方法你也可以
从上面的方法示例我们可以得出一个结论：在其他框架（自己会的）中常用到的方法或者场景进行针对性的学习即可。这样的好处是你能快速的上手开发，然后在实际开发场景中遇到解决不了的问题再去查文档或者百度。如果对你有感触的话，可以尝试一下这个方法；我觉得还是很不错的。
2023-11-09 09:39:45
149
原创 为什么Vue和React都选择了Hooks？
Vue 和 React 都选择了 Hooks 的设计模式，这是因为 Hooks 提供了一种更简单、更可维护、更可复用的方式来处理组件状态和副作用，相对于之前的类组件模式，Hooks 提供了更灵活的开发体验和更好的性能优化机会。总之，Vue 和 React 选择使用 Hooks 是因为它们提供了更简单、更灵活、更可维护的方式来管理组件状态和副作用，同时具备更好的性能优化潜力，这些特点有助于提高开发效率和代码质量。可以看到，使用 Hooks 的函数组件更简洁，不需要创建类，不需要使用。你可以在多个组件中使用。
2023-11-08 10:50:50
111
原创 在 React Router 中使用 JWT
现在我们已经准备好了 AuthContext和 Routes。让我们把它们整合到 App.jsx导入必要的组件和文件是从文件中导入的组件。它为整个应用程序提供了身份验证的上下文从 ./routes中导入 Routes。它定义了应用路由使用 AuthProvider组件包装 Routes组件组件用于向应用程序提供身份验证上下文。它包装了 Routes组件，使身份验证上下文可用于 Routes组件树中的所有组件return (
2023-11-08 10:16:48
602
原创 Vue项目图片预览v-viewer插件使用
v-viewer 是一个基于 Vue.js 的图片查看器组件，它允许你在项目中轻松地实现图片的查看和放大功能。在项目中使用 v-viewer 非常简单，下面是一个详细的介绍和如何在项目中使用的示例。通过以上步骤，你就可以在你的 Vue 项目中使用 v-viewer 来实现图片查看的功能。然后，在模板中，我们展示了单个图片和一个图片集合，当用户点击图片时，调用。组件被用作容器来包裹图片元素，这样就可以在图片上启用图片查看器功能。3.1 一旦你安装并配置了 v-viewer，你可以在你的组件中使用。
2023-11-07 13:47:45
2707
原创 IT行业就业热点与发展方向
随着技术的不断演进，IT行业将继续扩大，为寻求发展的人们提供更多机遇。无论你是已经在IT行业工作的专业人士还是刚刚踏入这个领域的新手，都可以在这些热点领域中找到适合自己的就业机会，创造成功的职业生涯。无论是企业还是个人，都需要不断适应这个领域的发展，了解哪些方向更适合就业，才能在竞争激烈的市场中取得成功。人工智能和机器学习已经成为IT行业的热门领域，取得了巨大的突破。AI工程师和数据科学家的需求急剧增加，他们的任务是开发智能算法、进行数据分析和构建深度学习模型。软件开发领域仍然是IT行业的核心组成部分。
2023-10-28 10:41:55
220
原创 Vue3快速上手
2020年9月18日，Vue.js发布3.0版本，代号：One Piece（海贼王）耗时2年多、2600+次提交30+个RFC600+次PR99位贡献者什么是hook？—— 本质是一个函数，把setup函数中使用的Composition API进行了封装。类似于vue2.x中的mixin。自定义hook的优势: 复用代码, 让setup中的逻辑更清楚易懂。
2023-09-20 16:46:47
314
2
原创 Vue2学习重点总结（Vue配置和使用+Vue脚手架配置代理+Vuex+Router）
组件化编码流程：(1).拆分静态组件：组件要按照功能点拆分，命名不要与html元素冲突。(2).实现动态组件：考虑好数据的存放位置，数据是一个组件在用，还是一些组件在用：1).一个组件在用：放在组件自身即可。2). 一些组件在用：放在他们共同的父组件上（状态提升(3).实现交互：从绑定事件开始。props适用于：父组件 ==> 子组件 通信子组件 ==> 父组件 通信（要求父先给子一个函数）
2023-09-08 15:01:39
513
原创 Vue全局组件与局部组件（详解）
全局组件适用于应用中需要在多个地方重复使用的组件，而局部组件适用于特定组件内部的、局限于某个上下文的组件。根据组件的复用性和作用域需求，你可以选择适当的方式来注册和使用组件，以构建出更可维护和模块化的 Vue 应用。全局组件适合于那些在整个应用中都需要用到的组件，比如通用的导航栏、页脚、弹出框等。这意味着它们只能在父组件的模板中或父组件的子组件中引用。局部组件适合用于那些只在特定情景下需要使用的组件，比如一个特定页面或区域的功能性组件。要在一个组件内注册局部组件，你需要在该组件的。
2023-08-23 17:46:56
1107
原创 Vue状态管理实战：从零到一掌握Vuex在Vue项目中的运用
这只是一个基本的例子，帮助你入门使用Vuex。实际应用中，你可能会使用模块化来组织Vuex的代码，处理更复杂的状态管理需求。当你在Vue项目中使用Vuex时，你正在使用一个专门用于状态管理的库，它有助于更好地组织、共享和更新应用程序的状态。下面是一个详细的步骤，演示如何在Vue项目中使用Vuex。首先，你需要确保在你的Vue项目中安装了Vuex。允许你在存储中派生出一些状态，类似于计算属性。这将是你的Vuex存储的入口文件。的文件夹，然后在该文件夹中创建一个名为。对象中，你可以定义应用程序的初始状态。
2023-08-18 15:53:33
126
原创 Node.js 安装和配置（完整详细版）
下载完成后，双击安装程序（.msi文件），会出现安装向导。在"Destination Folder"（目标文件夹）部分，您可以选择将Node.js安装到默认位置或选择其他位置。这个示例演示了一个基本的Node.js应用程序。您可以根据需要扩展和修改代码，学习如何使用Node.js构建更复杂的应用程序。不同的Linux发行版可能使用不同的包管理器。安装完成后，您就可以编写和运行Node.js应用程序了。，您将看到 "Hello, Node.js!在您的项目文件夹中创建一个新文件，例如。5.打开浏览器并访问。
2023-08-18 15:38:42
1468
原创 Vue脚手架——Vue-cli的安装和使用
Vue CLI（脚手架）是一个用于快速搭建 Vue.js 项目的官方命令行工具。它提供了项目初始化、开发服务器、构建等功能，使你能够更轻松地开始和管理 Vue 项目。以上是使用 Vue CLI 创建和运行项目的基本步骤。Vue CLI 提供了丰富的命令和选项，以及插件系统，让你能够轻松地扩展和定制项目的开发环境。这将启动一个交互式的命令行界面，你可以根据提示来配置项目的各种选项，如预设、特性等。这将编译项目并启动一个开发服务器，你可以在浏览器中访问。构建完成后，你会在项目目录中的。
2023-08-18 15:26:22
114
原创 Vue实例生命周期中的所有钩子函数
每个钩子函数都有其特定的用途，你可以在相应的阶段执行一些逻辑，从而实现不同的功能。Composition API 阶段的。需要注意的是，在 Vue 3 中，被认为是「已弃用」或「不推荐使用」的生命周期钩子函数有：beforeDestroy。钩子与 Options API 阶段的其他钩子是分离的，但你可以在。你应该尽量遵循官方文档的建议来使用适当的生命周期钩子函数。钩子中访问 Options API 阶段的数据和方法。替代）和 activated。替代）、destroyed。（使用 unmounted。
2023-08-18 15:17:15
380
原创 Vue计算属性传参(computed)
在 Vue 中，计算属性是一种方便的方式来处理复杂的逻辑和动态计算，而且它们也可以接受参数。通过传递参数给计算属性，你可以根据参数的不同值来返回不同的计算结果。计算属性是一个返回函数的计算属性。在模板中，我们可以像调用普通函数一样调用这个计算属性，并传递一个参数来计算折扣后的价格。需要注意的是，在计算属性内部使用函数来接受参数，这样可以确保计算属性在每次使用时都可以根据参数重新计算，而不会缓存结果。这只是一个简单的示例，你可以根据自己的需求传递不同的参数给计算属性，从而实现更复杂的计算逻辑。
2023-08-18 15:08:16
979
原创 Vue3手写api之reactive、readonly、ref
Vue 3 中的响应式编程 API 主要包括 reactive、readonly 和 ref。这些 API 允许你创建具有响应式行为的数据对象。下面是手写这些 API 的简单示例：
2023-08-18 15:02:23
415
原创 推荐几款Chrome 插件
国内访问：最早我是在Chrome 商店发现的，用了一下体验非常棒， 在github 上浏览项目可以在侧变栏的sourcegraph中随意浏览切换目录，比直接点击网页快了不止5倍。最关键的还不是这个，在点击进入代码后，还支持Ctrl+ 鼠标 去检索变量的，特别对于class 定义、方法definition和reference的检索，可以。
2023-08-03 16:57:04
56
原创 VS Code插件，这样配置让你的VS Code好用到飞！！！
我们在编写代码的时候鼠标移动到某个标签上，经常会自动弹出一些介绍信息，挡住部分代码，给我们的阅读带来了很大的困难，一直没有找到关闭它的方法，目前可以通过设置时间延迟暂时实现这个效果，我设置的5000毫秒，你可以设置的更大一些，基本上它就不会弹出来了。
2023-08-03 16:53:33
1343
原创 vue3使用pinia管理状态
使用defineStore定义store，第一个参数必须是全局唯一的id，可以使用Symbol// 第一个参数必须是全局唯一，可以是哟})counter: 0})})counter: 0})})})...),actions:{toHome(){})
2023-08-03 16:38:01
87
原创 2023年（js,css3,es6,Vue,react）面试常问面试题总结
服务端渲染（SSR）是一种将服务器端的数据和页面模板组合成完整的 HTML 页面并将其发送到客户端的技术。相比于传统的客户端渲染）技术，服务端渲染可以提升首屏渲染速度、SEO 友好、更利于移动设备访问等优点。服务端渲染的基本思路是，当用户发起请求时，服务器端根据请求的 URL 路径和参数等信息获取到所需的数据，并使用服务器端的模板引擎将数据和 HTML 模板进行组合，生成完整的 HTML 页面，并将其发送到客户端。
2023-07-29 17:23:51
449
1
原创 必读的Vue3基础知识
全局自定义指令在main.js中定义局部自定义指令在当前组件中定义// main.jsel.focus()})// 引入store定义函数// 定义store实例并导出// 第一个参数，字符串类型，唯一不可重复，作为库id来区分不同库// 第二个参数，以对象形式配置存储库的state、getters、actions/**state,存储全局状态必须是箭头函数：为了在服务器端渲染的时候避免交叉请求导致数据状态污染*/
2023-07-28 16:18:12
126
原创 px转换rem根据根节点设置响应
在上述代码中，我们手动计算并设置根节点的font-size，使其随着屏幕宽度的变化而调整。这样，在编写CSS样式时，可以使用px单位，它们会根据根节点的font-size转换成rem单位。根节点设置的为100px，在这里设置对应的根节点的大小，单位px。这样在样式里面就有换算单位的提示。这里对应也要写100px。
2023-07-20 15:00:45
127
1
原创 Node.js Express详解
Express 是基于 Node.js 平台，快速、开放、极简的 Web 开发框架使用 Express，我们可以方便、快速的创建 Web 网站的服务器或 API 接口的服务器。
2023-06-28 22:15:35
119
原创 node.js 初识 Express
官方给出的概念：Express 是基于Node.js 平台快速、开放、极简的Web 开发框架。通俗的理解：Express 的作用和 Node.js 内置的 http 模块类似，是专门用来创建 Web 服务器的。Express 的本质：就是一个 npm 上的第三方包，提供了快速创建 Web 服务器的便捷方法。Express 的中文官网：Express - 基于 Node.js 平台的 web 应用开发框架 - Express 中文文档 | Express 中文网广义上来讲，路由就是。
2023-06-28 22:00:56
50
原创 WebSocket的使用（详解）
WebSocket是一种基于TCP的全双工通信协议，它提供了在Web应用程序和服务器之间进行实时、双向通信的能力。相比传统的HTTP请求-响应模式，WebSocket能够建立持久连接，允许服务器主动向客户端推送数据，而不需要客户端发送请求。
2023-05-28 10:05:57
2534
原创 初识 Node.js
② 在开发期间，自己的电脑既是一台服务器，也是一个客户端，为了方便测试，可以在自己的浏览器中输入 127.0.0.1 这个IP 地址，就能把自己的电脑当做一台服务器进行访问了。如果把“个人电脑”比作“一台电话”，那么“IP地址”就相当于“电话号码”，只有在知道对方 IP 地址的前提下，才能与对应的电脑之间进行数据通信。通过门牌号，外卖小哥可以在整栋大楼众多的房间中，准确把外卖送到你的手中。方法，就能方便的把一台普通的电脑，变成一台 Web 服务器，从而对外提供 Web 资源服务。
2023-05-23 20:34:04
43
原创 Node.js简介
JavaScript 诞生于 1995 年，几乎是和互联网同时出现；Node.js 诞生于 2009 年，比 JavaScript 晚了 15 年左右。在 Node.js 之前，JavaScript 只能运行在浏览器中，作为网页脚本使用，为网页添加一些特效，或者和服务器进行通信。有了 Node.js 以后，JavaScript 就可以脱离浏览器，像其它编程语言一样直接在计算机上使用，想干什么就干什么，再也不受浏览器的限制了。
2023-05-23 18:43:45
38
原创 TypeScript 第二章：面向对象
要创建对象，必须要先定义类，所谓的类可以理解为对象的模型，程序中可以根据类创建指定类型的对象，举例来说：可以通过Person类来创建人的对象，通过Dog类创建狗的对象，通过Car类来创建汽车的对象，不同的类可以用来创建不同的对象。上例中，test函数有一个参数类型不确定，但是能确定的时其返回值的类型和参数的类型是相同的，由于类型不确定所以参数和返回值均使用了any，但是很明显这样做是不合适的，首先使用any会关闭TS的类型检查，其次这样设置也不能体现出参数和返回值是相同的类型。
2023-05-23 18:30:30
52
原创 TypeScript 第一章 快速入门
TypeScript是JavaScript的超集。它对JS进行了扩展，向JS中引入了类型的概念，并添加了许多新的特性。TS代码需要通过编译器编译为JS，然后再交由JS解析器执行。TS完全兼容JS，换言之，任何的JS代码都可以直接当成JS使用。相较于JS而言，TS拥有了静态类型，更加严格的语法，更强大的功能；TS可以在代码执行前就完成代码的检查，减小了运行时异常的出现的几率；TS代码可以编译为任意版本的JS代码，可有效解决不同JS运行环境的兼容问题；
2023-05-16 16:21:32
67
原创 Git 常用命令大全
删除分支：$ git branch -d [name] ---- -d选项只能删除已经参与了合并的分支，对于未有合并的分支是无法删除的。如果想强制删除一个分支，可以使用-D选项。git remote add origin git+ssh://[email protected]/VT.git # 增加远程定义（用于push/pull/fetch）如：$git submodule add git://github.com/soberh/ui-libs.git src/main/webapp/ui-libs。
2023-05-16 16:01:03
4934
原创 MySQL数据库命令
外连接查询中参与连接的表有主从之分，已主表的每行数据匹配从表的数据列，将符合连接条件的数据直接返回到结果集中，对不符合连接条件的列，将被填上null值再返回到结果集中。2、LIKE’[M-Z]inger’ 将搜索以字符串 inger 结尾、以从 M 到 Z 的任何单个字母开头的所有名称（如 Ringer）truncate table 删除的是表中所有的行，但表的结构，列，约束，索引等不会改变。LIKE’_heryl’ 将搜索以字母 heryl 结尾的所有六个字母的名称（如 Cheryl、Sheryl）。
2023-05-16 15:59:05
81
原创 JavaScript中的基本数据类型
一、类型可能许多习惯了C++、C#这类静态语言（强类型）语言的小伙伴们在编写Js代码时，会很不习惯，因为相对于静态语言来说，Js甚至没有类型的”概念“。而且Js中吐槽较多的恰恰就包含类型转换，在我们日常写代码时总是遇到或显示或隐示的类型转换，比如：你要获取数字123的个位十位百位，你会怎么做？使用类型转换形式多样。有些方式简明易懂，也很安全，然而稍不留神，就会出现意想不到的结果。为了学习和掌握类型转换，现在先让我们来深入了解一下值和类型。内置类型JavaScript 拥有。
2023-05-04 17:33:02
105
原创 JavaScript中的参数传递
在研究这个问题之前，大家可以回忆一下，Js基本的数据类型有哪些？如果分类？原始数据类型值 primitive type，比如UndefinedNullBooleanNumberString。引用类型值，也就是对象类型 Object type,比如ObjectArrayFunctionDate等。这是因为声明变量时不同的内存分配：原始值：存储在栈（stack）中的简单数据段，也就是说，它们的值直接存储在变量访问的位置。
2023-05-04 17:13:15
134
原创 JavaScript之闭包的理解
闭包就是函数内部的子函数——等于没说当函数可以记住并访问所在的词法作用域时，就产生了闭包，即使函数是在当前词法作用域之外执行。——靠谱闭包就是能够读取其他函数内部变量的函数，在本质上是函数内部和函数外部链接的桥梁——靠谱函数和对其周围状态（词法环境）的引用捆绑在一起构成闭包（closure）——很靠谱我们试着用代码来描述一下上面的回答，看看你最中意哪一个～1.1 闭包是函数内部的子函数var a = '小明';bar()foo();// 小明基于词法作用域的查找规则，bar函数可以成功的打印。
2023-05-04 17:06:24
74
原创 深入理解立即调用函数表达式（IIFE）
我们只需要用大括弧将代码的代码全部括住就行了，因为JavaScript里括弧()里面不能包含语句，所以在这一点上，解析器在解析function关键字的时候，会将相应的代码解析成function表达式，而不是function声明。还有种常用就是，用IIFE写惰性载入，因为函数被执行引擎以同步的方式立即执行了，所以当你在之后的代码访问这个变量的时候可以直接返回给你计算后的筛选结果了。有时，我们定义函数之后，立即调用该函数，这时不能在函数的定义后面直接加圆括号，这会产生语法错误。的设计模式，主要包含两部分。
2023-05-04 16:55:24
270
原创 (ES6) class关键字
当一个子类继承一个父类时，子类constructor构造器中就必须调用super函数，其super就是父类构造器的引用，执行super（）语句时，就相当于执行父类的constructor函数，所以如果此时父类的构造器有传形参，你在调用super（)时也要传参，不然，父类构造器中的参数都时underfined。两个例子可以说实际功能一模一样，可以看到里面有一个constructor方法，这就是构造方法，而this关键字则代表实例对象，且方法之间不需要逗号分隔，加了会报错。在这两种情况下，它的用法完全不同。
2023-04-25 11:57:14
77
原创 （ES6） Generator 函数详解
其实你可以把实际生活中的例子和generator关联起来，比如我给大家举个最简单的例子，便于大家理解：图解： 其实整个generator函数执行过程也可以理解为是做菜的过程，generator函数（）中的形参，可以理解为刚买回来的菜，洗菜、切菜、炒菜就是中间的一个个过程，干净的菜、切好的菜就是yield停下来产生的中间半成品结果，最终炒好的菜就可以理解为是return返回的最终结果。
2023-04-25 11:39:41
98
原创 JS阻止事件冒泡和默认事件
当事件发生后，这个事件就要开始传播（从里到外，或者从外向里）。为什么要传播呢？因为事件源本身（可能）并没有处理事件的能力，或处理事件的函数并未绑定在该事件源上。如下图：我们经常利用事件冒泡机制去减少给DOM添加过多的绑定事件即。
2023-04-21 09:47:19
213
什么是Web Workers(关键词-主线程)
2023-07-31
TA创建的收藏夹 TA关注的收藏夹
TA关注的人