- 博客(33)
- 收藏
- 关注
RSS订阅原创 token与axios拦截器
Token实现JWT身份认证1.1-Token介绍1.为什么要有token?默认情况下，HTTP是一个无状态协议，也就是说任何浏览器都可以访问服务器，但是服务器并不能知道浏览器到底是属于哪个用户的。2.token是什么 ： 身份令牌token是一串经过加密之后的字符串，相当于是用户一种身份认证令牌。类似于古代的腰牌,现代的工牌。见到这个牌子，服务器才知道你是自己人，才会把数据响应给你。
2023-07-03 09:49:01
577
原创 token了解（妈妈再也不怕我不会token了）
Token是服务端生成的一串字符串，以作客户端进行请求的一个令牌，当第一次登录后，服务器生成一个Token便将此Token返回给客户端，以后客户端只需带上这个Token前来请求数据即可，无需再次带上用户名和密码。
2023-07-03 09:05:12
463
原创 cookie、localStorage和sessionStorage三者的区别
2、localStorage和sessionStorage出现的时间较晚，对于版本较低的浏览器不支持(比如IE8版本以下的都不支持)1、cookie会参与到与服务端的通信中，一般会携带在http请求的头部中，例如一些关键密匙验证等。3、localStorage的有效期是在不进行手动删除的情况下是一直有效的。、cookie的创建（修改和创建相同，创建同样名称会覆盖之前的）1、cookie的有效期是可以设置的，默认的情况下是关闭浏览器后失效。1、cookie出现的时间较早，目前见到的浏览器都支持。
2023-07-01 19:20:02
166
原创 轮播图（让你看了一目了然）
轮播图有很多种实现方法，这是其中一种最清晰的方法。思路很清晰，代码很简单，欢迎大佬多指教。先来看下效果图，嫌麻烦就不用具体图片来实现了，主要是理清思路。（自动轮播，左右按钮切换图片，小圆点切换图片，鼠标移入暂停轮播，鼠标移出继续轮播）
2023-06-14 21:58:20
365
原创 vue3 中 tinymce+tinymce-vue 富文本编辑器使用
【代码】vue3 中 tinymce+tinymce-vue 富文本编辑器使用。
2023-06-14 21:57:00
288
原创 Pinia的简单使用
1.pinia 和 vuex 具有相同的功效， 是 Vue 的存储库，它允许您跨组件/页面共享状态。2.设计使用的是 Composition api，更符合vue3的设计思维。3.Pinia 对 Vue 2 和 Vue 3 都有效，并且不需要您使用组合 API。
2023-06-12 17:00:55
193
原创 Fetch简单封装
1.Fetch本质上是一种标准，该标准定义了请求、响应和绑定的流程。2.Fetch标准还定义了Fetch () JavaScript API。3.可用于前后端，数据交互。4.fetch返回的是promise对象，比XMLHttpRequest的实现更简洁，fetch 使用起来更简洁 ，完成工作所需的实际代码量也更少5.fetch 可自定义是否携带Cookie。6.fetch不像axios需要安装使用，fetch可以直接使用。
2023-06-12 16:52:08
784
原创 es6开发常用技巧
告诉浏览器——你希望执行一个动画，并且要求浏览器在下次重绘之前调用指定的回调函数更新动画。该方法需要传入一个回调函数作为参数，该回调函数会在浏览器下一次重绘之前执行。60Hz的刷新频率，那么每次刷新的间隔中会执行一次回调函数，不会引起丢帧，不会卡顿。可以存放一些初始化的信息，可以在触发的时候调用。对象，程序员可以使用里面的方法新增、删除、修改、查询节点上的class类。内置的事件会由浏览器根据某些操作进行触发，自定义的事件就需要人工触发。20.如何为指定选择器创建具有指定范围，步长和持续时间的计数器？
2023-06-12 16:50:39
73
原创 了解 Promise
原因则是Promise属于JavaScript引擎内部任务，而setTimeout则是浏览器API，而引擎内部任务优先级高于浏览器API任务，所以有此结果。这段代码定义了一个函数sleep，调用后，如果传入的实参大于10，你会发现他会触发then的回调函数，并且打印出成功，如果传入的实参小于10，你会发现他会触发catch的回调函数，并且打印出失败。然后，then方法指定的回调函数将在当前脚本所有同步任务执行完后才会执行，所以BBB 最后输出。，在异步操作失败时调用，并将异步操作的结果作为参数传递出去。
2023-06-12 16:49:01
43
原创 js 常用的开发技巧
上面代码是一个阶乘函数，计算 n 的阶乘，最多需要保存 n 个调用数据，复杂度为 function（n），如果改写成尾调用，只保留一个调用记录，复杂度为 function（1）。我们每次进行校验的时候都需要输入一串正则，再校验同一类型的数据时，相同的正则我们需要写多次， 这就导致我们在使用的时候效率低下，并且由于 checkByRegExp 函数本身是一个工具函数并没有任何意义。保存在变量中的是对象在堆内存中的地址，所以，与简单赋值不同，这个值的副本实际上是一个指针，而这个指针指向存储在堆内存的一个对象。
2023-06-12 16:42:58
126
原创 v-for和v-if 优先级的问题
如果避免出现这种情况，则在外层嵌套template（页面渲染不生成dom节点），在这一层进行v-if判断，然后在内部进行v-for循环。：永远不要把 v-if 和 v-for 同时用在同一个元素上，带来性能方面的浪费（每次渲染都会先循环再进行条件判断）如果条件出现在循环内部，可通过计算属性computed提前过滤掉那些不需要显示的项。不能直接这样写，会出现警告。
2023-06-12 16:35:31
33
原创 数组的常用方法总结
2.filter的回调函数需要返回布尔值，当为true时，将本次数组的数据返回给filter，最后filter将所有回调函数的返回值组成新数组返回（此功能可理解为“过滤”）。根据指定的数据，从左向右，查询在数组中出现的位置，如果不存在指定的数据，返回-1，找到了指定的数据返回该数据的索引。数组的第一项开始，逐个遍历到最后，迭代数组的所有项，然后构建一个最终返回的值。向数组中添加，或从数组删除，或替换数组中的元素，然后返回被删除/替换的元素。将数组的数据进行反转，并且返回反转后的数组，会改变原数组。
2023-06-09 09:45:51
43
原创 vue2 .sync修饰符
我们都知道，组件之间通过props 或者 $emit 传值都是单向数据流的。age是我们要修改的状态的名称，是我们手动配置的，与传入的状态名字对应起来。这时子组件触发了父组件的修改函数使父组件的age修改成了1234567。这里我们必须在事件执行名称前加上update：的前缀才能正确触发事件。这里注意我们的事件名称被换成了update：是被固定的也就是vue为我们约定好的名称部分。这样就很简单的实现了，数据的双向流。这样就完成了，是不是感觉简单了很多。
2023-06-09 09:45:05
287
原创 vuex 数据持久化插件
刷新页面，vuex里面数据丢失、清空。有时候我们需要把一些数据固话到本地，即使刷新也不能清空，例如：登陆状态、token等。这是就需要用到vuex数据持久化。
2023-06-09 09:41:53
304
原创 vue3+vant 移动端适配
postcss-pxtorem 是一款 postcss 插件，用于将 px 单位转化为 rem。lib-flexible 用于设置 rem 基准值。
2023-06-05 12:31:21
141
原创 vue2 vs vue3自定义指令
在vue中提供了一些对于页面 + 数据的更为方便的输出,这些操作就叫做指令, 以v-xxx表示类似于html页面中的属性指令的作用是什么呢？指令中封装了一些DOM行为, 结合属性作为一个暗号, 暗号有对应的值,根据不同的值，框架会进行相关DOM操作的绑定vue中常用的v-指令有那些呢？v-text 元素的InnerText属性,必须是双标签v-html 元素的innerHTMLv-if 判断是否插入这个元素v-else-ifv-else。
2023-06-05 12:21:57
97
1
原创 js常见问题梳理
Undefined，null，string，boolean，number，object(引用类型)；typeof null 返回object；symbol是基本数据类型，每一个symbol值都是一个全局唯一的字符串，你永远不会知道它里面存的什么，symbol值可以作为对象的属性的键。捕获是从上向下，冒泡是从下往上。
2023-06-05 12:04:44
93
1
原创 vue-router之 tag 和 v-solt 对比
/ 从代码中我们可以看到会被渲染成 span 标签假如我现在有四种路径router-link-active相当于模糊匹配，及2或3点击，1号(2,3是1的子路由)也会添加router-link-active样式；点击4号，1和2也会添加该类；router-link-exact-active相当于精准匹配，只会添加到点击的标签上；如果我们想修改选中的样式可以按照下面的写法：
2023-06-05 11:50:52
113
1
原创 js 复杂判断的简化
我们编写js代码时经常遇到复杂逻辑判断的情况，通常大家可以用if/else或者switch来实现多个条件判断，但这样会有个问题，随着逻辑复杂度的增加，代码中的if/else/switch会变得越来越臃肿，越来越看不懂,所以我们尽可能的让复杂的判断看起来清晰明了。
2023-06-05 11:13:26
91
1
原创 数组遍历（让你分清每一个遍历）
除了上述方法外，ES6 还提供了一个 for...of 循环，可以使用它来方便地遍历数组。这种方法类似于 for 循环，但具有更少的代码和更直观的语法。这些遍历方法在实际开发中非常常见，具体使用哪种方法取决于您需要实现的功能和性能需求。希望这篇博客对您有所帮助。
2023-05-11 20:31:57
97
原创 BOM和DOM
JavaScript 是一门用于开发互联网应用程序的脚本语言，通过浏览器的对象模型提供了对文档对象模型（DOM）和浏览器对象模型（BOM）的访问。在本文中，我们将重点介绍 BOM 和 DOM，并探讨它们在 Web 应用程序中的作用。1. 把整个 HTML 或 XML 文档看作一个树形结构，每个节点表示文档中的一个元素、属性或文本信息。2. 提供了丰富的 API，可用于访问和操作文档内容，包括读取和修改文档、检索元素和属性、添加和删除元素等。
2023-05-03 11:42:15
172
1
原创 创建ajax
当发送数据时，GET 方法向 URL添加数据:URL的长度是受限制的(URL的最大长度IE是2048 个字符，chrome最大长度8182个字符)●不需要重新加载整个页面的情况下，可以与服务器交换数据并更新部分网络内容；与 POST 相比，GET 的安全性较差，因为所发送的数据是URL 的一部分。POST比GET 更安全，因为台数不会被保存览器历史或web 服务器日志中。打开一个请求 open(请求方式,请求网址,同步/异步) 默认异步。●ajax可使因特网应用程序更小，更快，更友好。
2023-05-03 11:03:57
49
1
原创 JS实现轮播图（一看就懂逻辑清晰）
轮播图有很多种实现方法，这是其中一种最清晰的方法。思路很清晰，代码很简单，欢迎大佬多指教。先来看下效果图，嫌麻烦就不用具体图片来实现了，主要是理清思路。（自动轮播，左右按钮切换图片，小圆点切换图片，鼠标移入暂停轮播，鼠标移出继续轮播）
2023-05-02 16:06:05
2040
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人