- 博客(45)
- 收藏
- 关注
RSS订阅
原创 vue2.0项目安装依赖 sass 报错
2、原因：项目有点老，vue2的版本，所以node-sass在npm安装的时候大概率的会安装出错，或下载时间过长，因此考虑用dart-sass来替换。3、然后就可以成功运行了。
2024-06-24 16:07:02
260
原创 Vue3 + TS 防抖动
通过将多次连续触发的函数调用合并成一次来减少函数的执行次数。防抖的核心思想是在某个时间段内，只执行一次函数，而忽略在此时间段内的其他触发。（a）、封装函数 （新建文件：debounce.ts）(3)、等待时间结束，执行函数。(2)、重复调用时重置定时器；
2024-06-24 16:05:43
485
原创 Set 数据结构
Set 是一种叫【集合(由一堆无序、相关联且不重复的内部结构组成的组合，以[值，值的形式储存])】的数据结构。values() 返回键值。keys() 返回键名。
2024-06-20 11:21:08
226
1
原创 Map 数据结构
Set 是一种叫【字典(是一些元素的集合，以 [ 键，值 ] 的形式储存)】的数据结构。keys() 返回键名。values() 返回键值。使用运算扩展符 【...】
2024-06-20 11:20:42
425
原创 宏任务与微任务
script主代码块、setTimeout 、setInterval 、nodejs的setImmediate 、MessageChannel（react的fiber用到）、postMessage、网络I/O、文件I/O、用户交互的回调等事件、UI渲染事件（DOM解析、布局计算、绘制）、Ajax 等等。new Promise在实例化的过程中所执行的代码是同步的，而在 then中注册的回调函数才是异步的.即：主线程任务 => 异步任务（微任务 => 宏任务）1、微任务会在宏任务之前执行。
2024-06-19 14:11:29
149
原创 【1】、var、let、const 三者的区别
2、暂时性死区定义：在代码块内，如果引用了某个变量但是该变量没有被声明（即，在声明之前使用该变量），就会抛出一个ReferenceError。总结使用：常量使用const ，其他情况使用let ，避免使用var。如果把代码中的【let】改为【var】，则输出结果为 10 .【const】声明一个只读的常量，一旦声明，值就不能改变。【var】可以在声明前使用，即输出为undefined。【let】和【const】未声明不可使用，否则会报错。【let、const】不允许重复声明。【var、let】可以修改，
2024-06-18 15:49:09
437
原创 vue3+ts 动态生成侧边菜单列表
1、接口返回树形结构的菜单列表，存储于store 中。即可生成侧边栏列表 点击菜单切换不同页面。3、静态路由主页面数据。
2024-05-30 10:00:45
170
原创 vue3 + ts 动态添加路由，刷新页面白屏问题解决方案
然后就可以任意刷新页面了，有问题可以随时滴我........1、store 中添加路由的方法。2、main.ts中使用该方法。
2024-05-30 09:12:10
370
原创 Promise 概念基础
功能上：用来封装一个异步操作，并可以获取其成功或者失败的结果值。语法上：是一个构造函数，用来生成promise实例；注意：（ 状态改变只有两种可能，一旦改变 就不能再更改）
2024-05-21 11:26:08
329
原创 源码 axios 的创建过程模拟实现
3、通过bind方法，将实例对象中的属性与方法添加到instance中，并将instance返回，实现将axios当作对象或方法使用。1、在实例对象上添加两个属性：default(默认配置) 与 interscptors。2、在原型对象上添加方法。
2024-05-14 10:03:25
239
原创 object.key()用法
1、参数为对象：则返回为 对象属性名组成的数组。3、 参数为字符串：返回值为字符串索引的数组。一、概念：返回一个由一个给定对象的自身可枚举属性组成的数组。2、参数为数组：返回值为参数的索引数组。4、 判断对象是否为空。
2024-05-13 15:16:39
331
原创 原生Ajax
Ajax全称(Async Javascript and XML)，即异步的JS和XML。一、概念：基于浏览器的web开发技术，无刷新异步获取数据。二、原理（实现过程）
2024-05-10 10:24:24
296
原创 vue3 JSX的使用与警告【JSX 元素隐式具有类型 “any“，因为不存在接口 “JSX.IntrinsicElements“】解决办法
【代码】vue3 JSX的使用。
2024-05-09 13:23:59
916
原创 hooks与utils
hooks：通常用于存放 封装与组件状态（组件内部的数据和属性，这些状态组件的输出和行为）、生命周期相关的可复用逻辑，概括的说是存放响应式数据。文件命名以use开头。如果这段逻辑是一个纯业务逻辑，不需要了解Vue组件内部的状态，也不需要触发视图更新，那么它应该是一个util函数。如果这段逻辑是Vue组件特有的，涉及到了响应式变量、生命周期钩子等，那么更适合封装成hook。utils：工具函数，是通用型的纯函数，纯粹的数据处理方法，与vue响应式系统无关。
2024-05-09 13:14:52
241
原创 vue-Router 路由（常量路由）
以上完成 ，输入不同路径就可以跳转到对应页面了。2、新建文件：src/routes.ts。3、新建文件：src/index.ts。5、app.vue 中加入代码。4、main.ts 引入。
2024-04-19 10:25:09
359
原创 axios二次封装
新建文件：src/utils/request.ts。安装命令：pnpm i axios。首先引入axions。1、创建axios实例。
2024-04-16 09:08:41
302
原创 七、Mock 模拟后端接口
1、安装：pnpm install -D vite-plugin-mock mockjs。根目录下新建文件mock/user.ts。2、vite.config.ts 配置文件启用插件。3、模拟mock数据与接口。
2024-04-15 15:21:32
425
原创 六. 3、vue3 + ts 批量注册全局组件
1、新建存放全局组件插件的文件：src/components/SvgIcon/index.vue。2、配置全局ts代码：src/components/index.ts。注册全局组件的方法，可直接在组件中使用，无需引入！4、页面中使用：若有参数，传入指定参数即可。3、在main.ts中加入以下代码。
2024-04-15 13:40:57
1047
1
原创 六. 2、svg-icon 封装 全局使用
2、新建文件： src/components/Icon/index.ts 【全局导出】1、新建文件： src/components/Icon/src/Icon.vue。
2024-04-14 07:50:12
228
1
原创 五、项目中 element-plus按需引入使用
按需引入可以帮助你减少最终打包文件的大小，提高项目加载速度。完整导入会更方便，但是打包后的文件大小相对来说会比较大；4、在main.ts中引入样式。1、使用包管理器进行安装。2、 按需引入还需要安装。
2024-04-14 07:47:47
251
1
原创 四、环境变量的配置
顾名思义，开发使用的环境，每位开发人员在自己的dev分支上干活，开发到一定程度，同事会合并代码，进行联调。生产环境是指正式提供对外服务的，一般会关掉错误报告，打开错误日志。注意:一般情况下，一个环境对应一台服务器,也有的公司开发与测试环境是一台服务器！测试同事干活的环境啦，一般会由测试同事自己来部署，然后在此环境进行测试。项目根目录分别添加 开发、生产和测试环境的文件!3、.env.prod 【生产环境】开发环境（development）1、.env.dev 【开发环境】2、.env.test【测试环境】
2024-04-14 07:46:11
174
1
原创 项目配置 ： 2、prettier
eslint针对的是javascript，他是一个检测工具，包含js语法以及少部分格式问题，在eslint看来，语法对了就能保证代码正常运行，格式问题属于其次；prettier属于格式化工具，它看不惯格式不统一，所以它就把eslint没干好的事接着干，另外，prettier支持包含js在内的多种语言；2.3、根目录新建文件：【 .prettierignore】忽略文件并添加以下内容。2.2、根目录新建文件 ：【.prettierrc.json】，添加以下内容。
2024-04-12 08:34:37
117
原创 项目配置：3、stylelint
stylelint是css的lint工具。可格式化css代码，检查css语法错误与不合理的写法，指定css书写顺序等。官网:https://stylelint.bootcss.com/3、根目录下新建忽略文件：【.stylelintignore】2、根目录下新建配置文件【.stylelintrc.cjs】
2024-04-12 08:33:44
225
原创 二、项目配置：1、 eslint配置
2.1、vue3安装环境代码校验插件 ，让与prettier规则存在冲突的Eslint rules失效，并使用prettier进行代码检查。1、执行命令，生成.eslint.cjs初始化文件。二、初始化配置文件 【.eslint.cjs】
2024-04-11 13:31:04
460
1
原创 一、vue3+vite 项目初始化
pnpm]由npm/yarn衍生而来，解决了npm/yarn内部潜在的bug，极大的优化了性能，扩展了使用场景。被誉为“最先进的包管理工具”本项目使用vite进行构建，vite官方中文文档参考：(https://cn.vitejs.dev/guide/)按步骤输入 项目名称、框架(vue)、语言(Typescript)。运行【 pnpm run dev 】 运行项目。执行命令 【 pnpm i 】安装全部依赖；2.2、进入根目录下。
2024-04-11 09:47:16
172
1
原创 provide与inject
1、provide方法用于提供数据，此方法执需要传递两个参数,分别提供数据的key与提供数据value.vue3提供两个方法provide与inject,可以实现隔辈组件传递参数.2、后代组件可以通过inject方法获取数据,通过key获取存储的数值。provide[提供]inject[注入]
2024-04-09 16:42:34
231
1
原创 Vue3 - vite 项目报错： require is not defined（解决el-image引入图片报错）
1、静态引入图片错误代码页面报错显示：2、网上查了一些 ，很多都是说建议使用require,我也试了 ，代码没有提示错误，控制台报错了。
2024-04-09 16:35:47
742
原创 elemessage 消息弹框防抖，多次点击只显示与一次弹框
element-plus 中的Message消息提示 多次点击会重复出现，影响视觉美观。两步就可以达到效果。
2024-04-08 16:07:01
1100
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人