- 博客(32)
- 收藏
- 关注
RSS订阅原创 NProgress 的使用
作用：设置进度条的百分比，其中 n 是 0 ~ 1 之间的数字。NProgress 是前端轻量级 web 进度条插件。作用：以随机量递增进度条，但永远不会达到 100%。作用：进度条开始时的百分比（默认0.08）NProgress 一般搭配路由守卫使用。作用：是否显示右上角螺旋加载提示。作用：设置父容器（默认body）
2024-07-10 15:34:37
390
原创 axios 请求拦截器中添加 token
后端要求在 Authorization 字段携带 token，而 Cookie 自动携带的请求头叫 Cookie，后端代码还是在 Authorization 取，所以要迎合后端要求。大部分页面对应的数据接口，后端接口代码需要做鉴权（用户是否合法/身份权限合规），只有前端携带到后端的 token 有效，才能返回正常数据，token 就是后端用来做判断的标识。
2024-06-24 20:10:52
222
原创 Cookie vs localStorage
localStorage 纯前端操作 Cookie 前端可操作 后端也可操作(占多数)Cookie 会自动发送。
2024-06-24 20:10:02
487
原创 用户 token 持久化
业务背景：Token的有效期会持续一段时间，在这段时间内没有必要重复请求token，但是Vuex本身是基于内存的管理方式，刷新浏览器Token会丢失，为了避免丢失需要配置持久化进行缓存。Cookie 解释：浏览器本地存储区域，类似 localStorage。
2024-06-24 20:09:20
311
原创 数组的操作方法
5.splice 删除 替换 插入(本质是删除 返回的是删除的元素组成的数组[因为可以删除多个])find查找 返回的是第一个符合条件的元素 查不到会返回undefined。sclice 截取 负几是到着截取 返回的是新数组 不会改变原数组。every 数组中的每一个项都符合 返回true 否则返回false。map 映射 对原数组进行操作返回的是一个新数组 可以实现深拷贝。findLast查找数组中最后一个符合条件的元素。只要是添加的 返回值都是新数组的长度。删除的 返回值都是删除的元素。
2024-06-04 09:06:15
517
原创 自定义文件 .ts和.d.ts的区别
•当你需要使用一个外部库或模块时，如果没有现成的类型定义，你可能需要创建或查找一个 .d.ts 文件来添加类型信息，以供 TypeScript 编译器使用。总之，.ts 文件是用于编写和执行实际应用代码的，而 .d.ts 文件则是为了提供类型信息，增强代码的可读性和可维护性，同时确保类型安全。•.d.ts 文件是 TypeScript 的声明文件，专门用来定义类型信息，不包含任何可执行代码。•.ts 文件是 TypeScript 的源代码文件，包含了实际的可执行代码和类型注解。
2024-06-03 09:35:43
417
1
原创 正则表达式
基本概念•元字符：具有特殊意义的字符，如.（匹配任意单个字符）、*（匹配前面元素的零次或多次出现）、+（匹配前面元素的一次或多次出现）等。•字符类：方括号[]内定义的一组可选字符，如[abc]匹配'a'、'b'或'c'中的任意一个。•量词：控制匹配次数，如*、+、?、{n}、{n,m}等。•锚定符：指定位置匹配，如^匹配字符串开始，$匹配字符串结束。•** escape字符**：\用于转义特殊字符，使其作为普通字符对待，如\.匹配点字符。常见用途。
2024-06-01 16:02:50
1051
原创 vue3中函数必须有返回值么？
在 Vue 3 中，特别是涉及到Composition API的使用时，setup() 函数确实必须有返回值。setup() 函数是组件的入口点，它的返回值会被用来决定哪些数据和方法是可被模板访问的。如果setup()没有返回任何值，模板将无法访问到任何数据或方法，这在Vue 3组件中通常是不符合预期的。而对于Vue 3组件中的其他普通函数（非setup()），它们不一定需要有返回值，这取决于函数的用途。如果有具体的数据需要传递给调用者或用于响应式依赖，那么应当有相应的返回值。
2024-06-01 15:18:17
552
原创 两栏布局疑问
这样，即使左边栏使用了浮动，右边栏也不会跑到左边栏的内容上方。所以，在两栏布局中，为了保证布局的稳定性，我们需要为父元素创建一个 BFC。在两栏布局中，我们常常会遇到一个问题，即右边栏的内容可能会跑到左边栏的内容上方，这是因为左边栏使用了浮动，脱离了正常的文档流，导致右边栏的内容不再受父元素的高度控制。BFC（Block Formatting Context，块级格式化上下文）是一个独立的布局环境，它可以防止其内部元素影响外部的布局，并且可以阻止外部元素影响它的布局。，防⽌下⽅元素⻜到上⽅内容。
2024-05-31 11:48:05
256
原创 对于vsc中的vue命令 vue.json
打开vsc 然后在左下角有一个设置。将此代码粘贴 （我的不一定都适合）3.输入 vue.json回车。2.点击用户代码片段。
2024-05-31 11:41:47
519
原创 MVVM模式的优点以及与MVC模式的区别?
操作使⻚⾯渲染性能降低，加载速度变慢，影响⽤户体验。界⾯素来是⽐较难于测试的，⽽现在测试可以针对。开发⼈员可以专注于业务逻辑和数据的开发（通过数据来显示视图层⽽不是节点操作。），设计⼈员可以专注于⻚⾯设计。你可以把⼀些视图逻辑放在⼀个。
2024-05-29 15:43:55
519
原创 vue如何封装可复⽤的组件?以及请举例说明你封装过的组件? 讲解
所谓的这个封闭性就是当我们在组件内部定义好之后外部是⽆法进⾏修改的。所谓的开放性就是我们需要将动态的内容以及组件通信的⽅式进⾏数据传递。⽽所谓的粗细⼒度就是我们可以把⼀整个⻚⾯当作⼀个组件去进⾏封装。那么在封装的时候我们要注意组件的封闭性和开放性以及粗细粒度。所谓的如何封装可复⽤组件其实技术核⼼就是通过我们。在需要的⽤的组件⾥⾯引⼊创建的这个可复⽤的组件。接下来就需要对可复⽤的组件内容要进⾏封装。在这个⽂件夹内创建可复⽤的组件。以标签的形式写在对应的地⽅。的⽅法来获取搜索框输⼊的值。
2024-05-23 08:28:22
191
原创 深浅拷贝？
{name:"aaa",people:{name:"def"}} (拷贝成功)//JSON.parse(JSON.stringify(obj))方法拷贝3层。//拷贝2层(测试)-------------------------------------------------------------//拷贝1层(测试)------------------------------------------------------------a = ["a","b",{name:"张三"}];
2024-05-22 14:27:27
547
原创 又是一知识点
对于用v-for渲染的列表数据来说，v-for默认使用就地复用的策略，列表数据修改的时候，他会根据key值去判断某一个值是否修改，如果修改则重新渲染该项，否则复用之前的元素。在 Vue 中，父子组件通过 props 传递通信，从父向子单向传递。因为Vue实例中的数据是响应式的，而我们新增的属性并不是响应式的，所以有时无法实时的更新到视图上。首先我们先看在vue中出现的一种情况，我们在vue中如果使用v-if进行切换时，此时Vue为了更加高效的渲染，此时会进行前后比较，如果切换前后都存在的元素，则直接复用。
2024-05-21 15:36:47
923
原创 Javascript高级（二）
回调函数，就是放在另外一个函数（如 parent）的参数列表中，作为参数传递给这个 parent，然后在 parent 函数体的某个位置执行，Node.js 异步编程的直接体现就是回调。所谓的同源，指的是协议，域名，端口相同。浏览器处于安全方面的考虑，只允许本域名下的接口交互，不同源的客户端脚本，在没有明确授权的情况下，不能读写对方的资源。所谓的同源，指的是协议，域名，端口相同。浏览器处于安全方面的考虑，只允许本域名下的接口交互，不同源的客户端脚本，在没有明确授权的情况下，不能读写对方的资源。
2024-05-16 20:18:51
796
原创 Typescript中的类型约束
let a:number|string='' 用管道符隔开 //注 联合类型就是联合类型 不能用：any 包含的值太多。一.ts中的类型系统 ts的类型约束非常严格 切勿随便改动 null和undefined是任意类型的子类型。function函数 (输入(参数的约束)输出(返回值的约束)的约束)是特殊形式(知道数组中有几个 且知道每一个数组的类型)的数组。基本类型 类型注解 :number(······)unknown代表未知的类型 比never跟安全。
2024-05-15 10:22:32
550
原创 说⼀下vue中本地跨域如何解决?线上跨域如何解决?
在服务器端配置反向代理，将前端的请求转发到后端服务器，这种方式可以让前端和代理服务器之间的通信看起来像是同源的，从而绕过浏览器的跨域限制。总之，本地开发环境下主要依赖前端工具的代理功能来规避跨域，而线上环境则需后端服务器进行适当的配置以支持跨域请求。: 如果你的应用部署在nginx服务器上，可以通过配置nginx来实现反向代理和跨域处理，设置。在Vue中解决本地开发环境的跨域问题和线上生产环境的跨域问题通常采用不同的策略。开头的请求都会被代理到你指定的后端服务器，从而避免了跨域问题。
2024-05-15 08:31:04
433
原创 关于ES6中的promise知识
all([p1,p2,p3]) 接收一个数组为参数 只要数组里面的promise实例有一个失败了 就会失败 都成功才会成功。.allSettled([p1,p2,p3]) 不管成功还是失败都会返回 只不过会返回那个成功和失败。当我们对promise进行实例化的时候需要传一个函数作为一个参数;.then(res=>{成功的函数},err=>{失败的函数}) 通常是接收成功。.catch(err=>{失败的函数}) 通常是接收失败。.any([p1,p2,p3])返回第一个成功的。promise的实例方法。
2024-05-14 15:08:57
300
原创 js是单线程的语言
宏任务里有微任务和宏任务 微任务执行完毕后 再去执行宏任务。宏任务(script大的宏任务)执行完毕后 再执行微任务。2.遇到异步代码 先执行异步代码 然后将异步代码的回调函数放到任务队列中。promise（解决异步 只有在.then和.catch里才是异步）3.同步代码执行完毕后 去任务队列中取出回调函数执行。宏任务和微任务是交替执行的。js是一门异步单线程的语言 浏览器是一个多线程的环境自上而下执行。宏任务和微任务的关系。js把异步任务分为宏任务和微任务。单线程：同步任务和异步任务只能执行一个。
2024-05-11 15:41:26
404
原创 js小知识
新建⼀个空的结果数组，for 循环原数组，判断新数组是否存在当前元素，如果有相同的值则跳 过，不相同则push添加进新数组，⽤到indexOf()⽅法 、for循环、if判断等。JS中的substr()和substring()函数有什么区别。返回值：函数执行完成后，通过return语句将指定的数据返回。当分支比较多的时候，switch的执行效率比较高，而且结构更清。思路：如果表达式1为true，返回表达式2的值；如果表达式1 为false，返回表达式3的值。获取元素的方式有哪些。【考核知识点：获取元素】
2024-05-11 15:32:00
467
原创 javaScript初级-题库
新建⼀个空的结果数组，for 循环原数组，判断新数组是否存在当前元素，如果有相同的值则跳 过，不相同则push添加进新数组，⽤到indexOf()⽅法 、for循环、if判断等。首先执行表达式1（一般为初始化语句），再执行表达式2（一般为条件判断语句），判断表达式1是否符合表达式2的条件，如果符合，则执行表达式4，否则，停止执行，最后执行表达式3.Math.max()/Math.min() 求最大和最小值。对象是一组无序的相关属性和方法的集合， 所有的事物都是对象，例如字符串、数值、数组、函数等。
2024-05-11 11:48:40
520
原创 继承入门版（简约版）
函数.apply(this指向的，[参数1,参数2……函数.bind(this指向的)(参数1,参数2……函数.call(this指向的,参数1,参数2……// Animal.__pototype__.name = "2306A" //只能通过"Animal"来继承。其中构造函数内部this指向的是实例对象。// Animal.prototype.age = 10 //可以通过实例化对象继承。// 普通函数就会直接调用不会继承所以继承一般使用构造函数。// // arr 就会自动继承数组的方法。
2024-05-10 10:24:25
410
原创 css基础动画以及小知识点的汇总
rgba()和opacity都能实现透明效果，但最大的不同是opacity作用于元素，以及元素内的所有内容的透明度，而rgba()只作用于元素的颜色或起背景色。X轴：左手的大拇指指向x轴的正方向，其余手指的弯曲方向就是该元素沿着x轴旋转的正方向。Y轴：左手的大拇指指向y轴的正方向，其余手指的弯曲方向就是该元素沿着y轴旋转的正方向。有多个子元素时，给各个子元素设置各自的translateZ 可以实现不同的3D效果。E[att*="val"] 选择具有att属性且属性值中包含val的E元素。
2024-05-10 09:25:31
260
原创 超级基础的css语言
而这个盒子由:内容(content)、内边距(padding)、边框(border)、外边距(margin)四部分组成.标签的含义，方便阅读和维护，便于网络爬虫很好的解析，从而更好的分析优化搜索引擎。important>行内样式）>ID选择器>类选择器>标签选择器>通配符选择器。标签的含义，方便阅读和维护，便于网络爬虫更好的解析，有利于更好的搜索引擎优化。注释是给人看的，目的是为了更好的解释这一部分的代码是干啥的程序不执行这个代码。设置HTML页面中的文本内容、图片的外形以及版面的布局和外观显示样式。
2024-05-10 08:32:27
391
原创 同步异步相关理解
同步代码按照书写顺序依次执行。一个任务必须等待前一个任务完成后才能开始，形成了一个线性的执行序列。在执行同步代码时，JavaScript引擎会阻塞执行后续操作，直到当前任务完成。
2024-05-09 15:54:57
389
1
原创 js中的垃圾回收机制
JavaScript的垃圾回收机制（Garbage Collection, GC）是一种自动管理内存的技术，用于自动追踪和回收不再使用的内存空间，以防止内存泄漏，保持程序运行时的高效和稳定。这一机制对于JavaScript这样的动态语言尤为重要，因为它允许开发者无需手动分配和释放内存。JavaScript主要采用两种垃圾回收算法：标记-清除（Mark-and-Sweep）和引用计数（Reference Counting）。
2024-05-09 15:49:41
293
原创 关于vue通信的知识汇总以及父子组件的……
的组件是基于配置的，我们通常编写的组件是组件配置⽽⾮组件，框架后续会⽣成其构造函。组件通信⽬的：传递或共享某些数据，解决组件间数据⽆法共享的问题。，⾃定义事件，插槽等，它们主要⽤于组件通信、扩展等；组件使⽤按分类有：⻚⾯组件、业务组件、通⽤组件；的时候 就⽤到这个⽅法 适⽤于多级组件传值。组件是独⽴和可复⽤的代码组织单元。对⽗组件进⾏操作，在⽗组件内可以直接通过。⾥存放的是⽗组件中绑定的⾮原⽣事件。在⼦组件的标签上定义属性 ⼦组件通过。在⽗组件调⽤⼦组件时候要加下标也就是。和通常可复⽤的组件构建⼤型应⽤；
2024-05-08 10:58:45
320
1
原创 时间戳的知识点
是从1970年1月1日00:00:00开始的秒数到现在的毫秒数。因为时间戳是唯一的，可以作为标识符 eg每时每刻都有人注册。获取时间戳：new Date().getTime()转换时间戳：new Date(时间戳)2.为什么非得用时间戳？插件：时间的moment.js。获取年 月 日 时 分。
2024-05-08 10:28:04
222
3
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人