- 博客(25)
- 收藏
- 关注
RSS订阅原创 闲谈Promise
虽然上面的代码能实现我们想要的结果，但一些情形下，需要嵌套更多回调函数时，多层嵌套让代码可读性非常差，后期的维护或者异常处理等都变得特别繁琐，让缩进格式也变得非常麻烦。当数组中的每一个都已敲定时，返回的 Promise 将被兑现，并带有描述每个 Promise 结果的对象数组。返回一个 Promise，这个返回的 promise 会随着第一个 promise 的敲定而敲定。finally() ：用于注册一个在 promise 敲定（兑现或拒绝）时调用的函数，无论是兑现还是拒绝，都是调用同一个函数。
2024-10-12 21:32:24
1143
原创 手写数组方法之sort
如果没有传递参数，则进行默认排序。默认排序是将元素转换为字符串，然后按照它们的 UTF-16 码元值升序排序。sort():对数组的元素进行排序,改变原数组。它可以传递一个定义排序顺序的函数作为参数。
2024-10-09 00:20:21
171
原创 手写数组方法（一）
slice:返回一个新数组，不改变原数组，浅拷贝。concat:用于合并两个或多个数组，不改变原数组，返回一个新数组。如果没有参数，则返回原数组的一个浅拷贝数组。unshift:向数组的开头添加一个或多个元素，返回新数组长度，改变原数组。push:向数组的末尾添加一个或多个元素，返回新数组的长度，改变原数组。reverse：反转数组中的元素，返回反转后数组，改变原数组。shift:移除数组的第一项，返回被删除的数据，改变原数组。pop：删除数组的最后一位，返回被删除的数据，改变原数组。
2024-09-24 18:44:13
400
原创 react中关于token的两个场景
注意：在axios拦截器中无法使用react中的hook(以use开头的函数被称为hook)，所以无法使用useSelector拿到store中的token数据。在react项目中，路由跳转前需判断是否存在token，有则正常跳转，没有则去登录页面。对于每个axios请求，都需要在header添加上token数据。如你有问题或疑惑，欢迎在评论区写下，必将努力解答；如本文有误区，希望你不吝赐教，让我们共勉！
2024-08-30 21:59:02
614
1
原创 console.log、setTimeout和Promise的输出顺序
js引擎遇到Promise，直接执行Promise中的代码（就像遇到同步代码一样），Promise中的resolve(),reject()会触发then()，then()方法中的回调函数会被添加到微任务队列中等待执行。所以js代码执行顺序：同步代码-->异步中的微任务-->异步中的宏任务。如你有问题或疑惑，欢迎在评论区写下，必将努力解答；如本文有误区，希望你不吝赐教，让我们共勉！先看题目：你们可以先自己想想，再看答案。
2024-07-30 00:08:11
347
原创 vue3+fetch请求+接收到流式的markdown数据+一边gpt打字机式输出内容，一边解析markdown语法+highlight.js实现代码高亮
如果你接收到的数据格式和我的不一样，我也不确定能不能帮到你，因为之前我的后端给我返回的数据格式不长这样，之前是直接是data:'数据'的格式，我试过很多方法都不能边接收markdown语法的数据，边正确解析渲染到页面上，当时我没想过可能是后端数据格式的问题，我就一直认为是我这边的问题。data里的content存放的就是ai回复的一部分数据，但这个数据是Unicode格式的字符串，前端（我）需要做的就是实现视频中的效果：打印机式的输出+实时解析markdown文本并正确渲染到页面上。这个问题终于解决了！
2024-07-26 10:34:29
8306
19
原创 后端传二进制文件流，vue前端接收并下载
我一直没有解决，我那很强的老板一看，说是后端那边的问题，emmm，一下子就放松了，哈哈哈。对这两个方法，我还有一些没懂的地方，所以本文只是分享或许可行的方法。我一开始对这个方法二嗤之以鼻，没想到它居然真的可行，真强！如你有问题或疑惑，欢迎在评论区写下，必将努力解答；如本文有误区，希望你不吝赐教，让我们共勉！前端需要下载到本地。
2024-07-12 10:38:29
287
1
原创 像ChatGPT一样实现打印机式输出
如果是使用了markdown语法的文本，想要正常显示还得解析markdown文本，上网搜索解析markdown文本的方法即可，这里我给不出具体的方法，因为我找了好几个方法，都解析不完全.....emmm心累，要是你有可行的方法，期待你的分享。最近在工作中，需要实现一个场景：用户向ai提问之后，ai的回复是一部分一部分的持续输出，而不是等全部内容生成之后再一次性回复。这个场景的好处：像这种打印机式的输出，用户的体验感会更好。
2024-07-11 14:06:23
1328
1
原创 在edge浏览器中scrollbar-color 不生效
在项目中遇到需要修改滑动条样式的需求，上网一查，大部分都说使用scrollbar-color ，但我使用之后，在edge浏览器打开并没有生效，在谷歌浏览器（Google Chrome）生效了。是一个比较新的 CSS 属性，用于指定滚动条的颜色。然而，它的兼容性可能会有限。如你有问题或疑惑，欢迎在评论区写下，必将努力解答；如本文有误区，希望你不吝赐教，让我们共勉！
2024-07-07 16:41:06
408
原创 vue3中导入图片使用@/.....失效，使用import有效
在vue中，我们为了简化路径，在vite.config.ts配置了用@代替src，在解析之后，@应该要变回src，但这里没有，还是@，所以图片路径没有正确解析出来，导致图片加载不出来。在写一个项目时，我就是直接这样写的，但是发现图片加载不出来！是一个字符串变量，Vue在解析这个路径时不会自动将。如你有问题或疑惑，欢迎在评论区写下，必将努力解答；如本文有误区，希望你不吝赐教，让我们共勉！图片路径正确显示，图片加载出来了。
2024-07-07 15:36:13
648
原创 vue中创建元素，你还在用createElement?
使用v-for创建元素更适合需要重复创建类似元素的情况，如果只要生成一个元素，可以使用v-if或v-show去控制元素的显示或隐藏，从而达到效果。上述代码是js创建元素的方法，在vue中如果你直接这样写，也能实现生成元素的效果，但！你直接操作了DOM，现有一个场景：在vue的项目中，点击一次按钮，创建一个新元素，可以多次点击，你会怎么实现？可能会导致更多的DOM操作，而Vue的目标是尽可能减少直接操作DOM，通过数据驱动视图。
2024-07-07 15:02:43
631
原创 从url到页面的过程发生了什么
从浏览器中输入url到页面的形成，这中间发生了什么，请往下看吧。输入url --- 解析url --- 缓存判断 --- DNS解析 ---获取MAC地址 --- TCP三次握手 --- 发送HTTP请求 --- 响应HTTP请求 ---页面渲染（ 构建DOM --- 构建CSSOM --- 构建渲染树 --- 布局 --- 绘制）--- TCP四次挥手。
2024-06-19 19:35:44
672
1
原创 vue插槽
个人感觉插槽就是在一个想要复用的组件中留出位置，可以根据使用场景的不同插入不同的内容，让组件的复用更加灵活。简单点理解，匿名插槽和具名插槽就是属性名不一样，作用域插槽就是在函数中传递了数据。匿名插槽、具名插槽和作用域插槽可以看做一个对象中的属性，调用各自的函数。：就是在匿名插槽或具名插槽的基础上，使用msg传递数据。默认插槽（匿名插槽），具名插槽，作用域插槽。具名插槽的页面效果和匿名插槽的差不多，不展示了。
2024-06-11 14:53:46
433
原创 html5 新特性
下面代码中的注释可以看看，全网很多道友都总结了html5的新特性，非常的全面，所以本文单纯分享一下个人的笔记。html5 ：HTML最新的修订版本。
2024-05-08 17:20:48
315
1
原创 关于js中闭包的简洁介绍
使变量可以驻留在内存，不被回收。这是它的优点，也是缺点：处理不当，会造成内存泄漏。(1)外部函数嵌套一个内部函数，且外部函数定义了内部变量。，就是一些你访问不到或用不到的变量，还占据着内存空间，不能被再次利用起来。可以通俗理解成：闭包让我们有权访问另一个函数作用域中内部变量或数据。闭包让你可以在一个内层函数中访问到其外层函数的作用域。(2)内部函数使用了外部函数的内部变量。解决办法：使用完成之后，让函数=null。
2024-04-01 10:08:47
163
原创 js节流和防抖
节流和防抖都是对高频触发事件的优化 ，去减少资源的浪费，提高前端性能运用场景：input输入事件，滚动条的scroll事件，改变窗口大小...注意点：下面的两段代码都触发了闭包，如果不知道闭包是什么，建议先了解。
2024-04-01 09:31:48
253
原创 改变this指向
箭头函数的this指向和调用无关，它定义时的环境已经决定了它的指向，后面不能被改变,使用call,apply,bind都不能使其改变，箭头函数本身没有this，只不过拿外层的this来用。
2024-03-31 22:00:28
362
1
原创 vue3背景下，el-input嵌套在弹出框中，自动聚焦“失效”？如何实现自动聚焦
原因或许是，使用autofocus时，确实聚焦了！但是当我们又点击 显示弹出框的按钮时，input又失焦了，所以当我们看到input框时，没有自动聚焦。
2024-03-27 23:25:30
1003
原创 导致elementPlus组件失效的一种可能，如el-drawer失效，其他组件失效也可以试着参照本文
问题原因：在整个项目建立时，如果已经按照官网的“快速开始”模块，对组件进行了自动导入，那么在使用组件时.....
2024-03-23 19:35:43
881
2
原创 margin：auto只能实现水平居中，不能实现垂直居中？实现盒子水平垂直居中的几种方法
在水平方向，margin会填充元素中除border，width，padding剩余空间，如果设置了auto，就会平分剩余空间，实现水平居中。但在垂直方向上，块级元素不会自动扩展，其他外部盒子没有自动填满父元素，也就没有剩余空间，所以不能实现垂直居中。：margin：auto既不能实现水平居中也不能实现垂直居中，因为行内元素水平垂直方向上默认没有剩余空间。第一个问题：margin：auto只能实现水平居中，不能实现垂直居中？，margin：auto 和margin： 0 auto效果一样。
2024-03-22 10:15:53
1510
1
原创 解决margin塌陷现象：父盒子没有设置margin,子盒子设置了，但在页面上父盒子也出现margin现象
解决margin塌陷问题：父盒子没有设置margin,子盒子设置了，但在页面上父盒子也出现margin现象
2024-03-21 11:38:51
526
2
原创 ElementPlus里面的menu折叠出现问题
ElementPlus里面的menu折叠出现问题，问题原因：当el-menu中只嵌套el-menu-item时，文字需用span或其他标签包裹起来
2024-03-18 08:57:43
1104
1
原创 全局路由守卫和pinia同时使用存在的问题
全局路由守卫和pinia同时使用存在一个问题，报错原因： router 挂载比 pinia 早, 守卫在使用pinia时，pinia还没有挂载。解决办法如B代码：只需将 pinia 写在全局路由守卫里面。A代码和B代码只有 pinia创建语句位置 的不同。
2024-03-17 20:45:38
1171
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人