<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[AM1n98的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/AM1n98</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; AM1n98]]></copyright><item><title><![CDATA[分片并发上传实现]]></title><link>https://blog.youkuaiyun.com/AM1n98/article/details/152809983</link><guid>https://blog.youkuaiyun.com/AM1n98/article/details/152809983</guid><author>AM1n98</author><pubDate>Thu, 09 Oct 2025 17:55:46 +0800</pubDate><description><![CDATA[先上流程图。]]></description><category></category></item><item><title><![CDATA[如何用keepAlive实现标签页缓存]]></title><link>https://blog.youkuaiyun.com/AM1n98/article/details/149536589</link><guid>https://blog.youkuaiyun.com/AM1n98/article/details/149536589</guid><author>AM1n98</author><pubDate>Tue, 22 Jul 2025 15:58:26 +0800</pubDate><description><![CDATA[首先，要明确所说的是TCP的 KeepAlive 还是HTTP的 Keep-Alive。TCP的KeepAlive和HTTP的Keep-Alive是完全不同的概念，不能混为一谈。实际上HTTP的KeepAlive写法是Keep-Alive，跟TCP的KeepAlive写法上也有不同。]]></description><category></category></item><item><title><![CDATA[Vite的依赖预构建]]></title><link>https://blog.youkuaiyun.com/AM1n98/article/details/149420849</link><guid>https://blog.youkuaiyun.com/AM1n98/article/details/149420849</guid><author>AM1n98</author><pubDate>Thu, 17 Jul 2025 14:39:23 +0800</pubDate><description><![CDATA[用名称去访问的模块是 bare import（又称裸模块）用路径去访问的模块不是 bare import// vue 是 bare import// 以下不是裸依赖本文介绍了 Vite 依赖预构建是什么、为什么要进行预构建，以及预构建的全流程：1. 扫描入口文件，然后通过这些入口，扫描所有用到的依赖2. 将多个依赖进行打包3. 修改这些模块的引入路径Vite预构建Vite的依赖扫描。]]></description><category></category></item><item><title><![CDATA[【插件】vue-i18n的安装和使用全解]]></title><link>https://blog.youkuaiyun.com/AM1n98/article/details/149349323</link><guid>https://blog.youkuaiyun.com/AM1n98/article/details/149349323</guid><author>AM1n98</author><pubDate>Tue, 15 Jul 2025 17:57:22 +0800</pubDate><description><![CDATA[vue-i18n是Vue.js的国际化插件，它提供了丰富的API和配置选项，支持多种语言切换、语言资源管理、日期时间格式化等功能，能够满足不同场景下的国际化需求。]]></description><category></category></item><item><title><![CDATA[【HTTP】取消已发送的请求]]></title><link>https://blog.youkuaiyun.com/AM1n98/article/details/148874908</link><guid>https://blog.youkuaiyun.com/AM1n98/article/details/148874908</guid><author>AM1n98</author><pubDate>Tue, 24 Jun 2025 16:50:27 +0800</pubDate><description><![CDATA[在页面中，可能会因为某些操作多次触发某个请求，如多次点击某按钮触发请求，实际上我们只需要最后一次请求的返回值，但是由于请求的耗时不一，请求未必会按发送的顺序返回，导致我们最终获取到的值 ≠ 最后一次发送请求的返回值。根据项目经验，目前一共尝试过两种方法1. 设置请求的唯一 id2. 使用 axios 官方方法：AbortController。]]></description><category></category></item><item><title><![CDATA[Sass相关]]></title><link>https://blog.youkuaiyun.com/AM1n98/article/details/148455150</link><guid>https://blog.youkuaiyun.com/AM1n98/article/details/148455150</guid><author>AM1n98</author><pubDate>Mon, 16 Jun 2025 10:19:24 +0800</pubDate><description><![CDATA[这是一个 PostCSS 插件，用于将现代 CSS 特性转换为兼容旧浏览器的代码。它会根据目标浏览器的需求自动添加浏览器前缀。那么，如何将该文件中定义的公共样式引入到全局，让全局各个文件都能使用呢？是一个工具，可以使用插件来转换 CSS，例如自动添加浏览器前缀、转换单位等。文件中的变量可以在项目中的任何 SCSS 文件中直接使用，而无需手动导入。这是一个 PostCSS 插件，用于将 CSS 中的。会被自动插入到每个 SCSS 文件的开头。中的内容自动插入到每个 SCSS 文件的开头。伪类或其他现代特性，]]></description><category></category></item><item><title><![CDATA[try...catch...捕捉错误]]></title><link>https://blog.youkuaiyun.com/AM1n98/article/details/148684708</link><guid>https://blog.youkuaiyun.com/AM1n98/article/details/148684708</guid><author>AM1n98</author><pubDate>Mon, 16 Jun 2025 10:00:39 +0800</pubDate><description><![CDATA[可以捕获await调用中的错误。但是如果在await调用的异步操作中使用了Promise链（例如.then()或.catch()），该错误可能只会被Promise链捕获，而不是直接抛出到块中。不会被最外层的捕获，而是会传递到Promise的catch方法中。如果在该请求中未写处catch方法，那这个错误就不会被捕获到。为避免这种情况，建议统一使用，避免混合使用Promise链，并用 try...catch...来捕获错误。]]></description><category></category></item><item><title><![CDATA[【Pinia】Pinia和Vuex对比]]></title><link>https://blog.youkuaiyun.com/AM1n98/article/details/148449895</link><guid>https://blog.youkuaiyun.com/AM1n98/article/details/148449895</guid><author>AM1n98</author><pubDate>Thu, 05 Jun 2025 14:31:36 +0800</pubDate><description><![CDATA[Pinia 是 Vue 官方团队成员专门开发的一个全新状态管理库，并且 Vue 的官方状态管理库已经更改为了 Pinia。在 Vuex 官方仓库中也介绍说可以把 Pinia 当成是不同名称的 Vuex 5，这也意味不会再出 5 版本了。]]></description><category></category></item><item><title><![CDATA[【定时器】定时器存在的内存泄露问题]]></title><link>https://blog.youkuaiyun.com/AM1n98/article/details/148432911</link><guid>https://blog.youkuaiyun.com/AM1n98/article/details/148432911</guid><author>AM1n98</author><pubDate>Wed, 04 Jun 2025 19:06:10 +0800</pubDate><description><![CDATA[如果回调函数中使用了闭包，可能会导致定时器一直占据着某个引用的外部变量，这个变量可能是一个大体积量的数据，或是一个大型 DOM 元素，这回阻止这些数据被垃圾回收。比如当页面被销毁或组件被卸载时，若没有做清理定时器的操作，那定时器会仍然在运行，它会持有对回调函数的引用，阻止回调函数及其依赖的变量被垃圾回收。，这样频繁的执行闭包函数，那么这个外部变量相当于一直被引用，若它是个大体积量数据，则会一直占据内存，导致内存泄漏。如果定时器的回调函数引用某个 DOM 元素变量，且这个 DOM 元素变量是在外部定义的。]]></description><category></category></item><item><title><![CDATA[【HTML】querySelector与getElementBy系列的区别]]></title><link>https://blog.youkuaiyun.com/AM1n98/article/details/148406604</link><guid>https://blog.youkuaiyun.com/AM1n98/article/details/148406604</guid><author>AM1n98</author><pubDate>Tue, 03 Jun 2025 17:44:16 +0800</pubDate><description><![CDATA[在使用的时候getElement这种方法性能比较好，query选择符则比较方便．得到的元素不是需要很麻烦的多次getElementBy..的话，尽量使用getElementBy..,因为他快些。得到的元素需要很麻烦的多次getElementBy..组合才能得到的话使用querySelector，方便。看实际情况，你决定方便优先还是性能优先，]]></description><category></category></item><item><title><![CDATA[【Node】对老项目进行node升级兼容]]></title><link>https://blog.youkuaiyun.com/AM1n98/article/details/148404832</link><guid>https://blog.youkuaiyun.com/AM1n98/article/details/148404832</guid><author>AM1n98</author><pubDate>Tue, 03 Jun 2025 17:01:52 +0800</pubDate><description><![CDATA[我的项目是vue2+node14搭建的，现根据公司要求需要升级node至20以上。实际上，只要本地node切换到20版本，并且能正常运行起来就没什么问题。我使用了最简单粗暴的方法，直接切换到20版本，然后npm run dev，看有什么报错，可能会出现依赖包版本过低，或者依赖包不兼容node的问题。这样的话有什么问题就修复什么问题。]]></description><category></category></item><item><title><![CDATA[【基础】offsetHeight、clientHeight和scrollHeight的区别]]></title><link>https://blog.youkuaiyun.com/AM1n98/article/details/148311743</link><guid>https://blog.youkuaiyun.com/AM1n98/article/details/148311743</guid><author>AM1n98</author><pubDate>Thu, 29 May 2025 15:40:25 +0800</pubDate><description><![CDATA[offsetHeight = 内容高度 + padding + borderclientheight = 内容高度 + paddingscrollHeight = 内容实际尺寸 + padding。]]></description><category></category></item><item><title><![CDATA[【样式】关闭浏览器的拼写检查]]></title><link>https://blog.youkuaiyun.com/AM1n98/article/details/147566986</link><guid>https://blog.youkuaiyun.com/AM1n98/article/details/147566986</guid><author>AM1n98</author><pubDate>Sun, 27 Apr 2025 19:23:27 +0800</pubDate><description><![CDATA[当写入错误或者不合理的单词时，el-input会有红色波浪线提示，经测试发现edge不会提示，chrome会发生这种情况。]]></description><category></category></item><item><title><![CDATA[【定时器】setInterval可能的坑]]></title><link>https://blog.youkuaiyun.com/AM1n98/article/details/147458861</link><guid>https://blog.youkuaiyun.com/AM1n98/article/details/147458861</guid><author>AM1n98</author><pubDate>Wed, 23 Apr 2025 18:33:32 +0800</pubDate><description><![CDATA[会无视代码的错误。就算遇到了错误，它还是会一直循环下去，不会停止。这就导致了可能你代码里存在着一些问题（比如你的代码可能有个一定概率下会发生的错误，而你使用setinterval来循环调用它，由于不会因为报错停止，所以这个问题可能被隐藏），可是却很难发现。]]></description><category></category></item><item><title><![CDATA[【样式】常用样式修改-收集]]></title><link>https://blog.youkuaiyun.com/AM1n98/article/details/146389877</link><guid>https://blog.youkuaiyun.com/AM1n98/article/details/146389877</guid><author>AM1n98</author><pubDate>Thu, 20 Mar 2025 10:24:40 +0800</pubDate><description><![CDATA[若需要局部改变滚动条样式，比如改变.container这个盒子下的滚动条样式。::-webkit-scrollbar ： 定义了滚动条整体的样式。::-webkit-scrollbar-track ： 轨道部分。::-webkit-scrollbar-thumb ： 滑块部分。]]></description><category></category></item><item><title><![CDATA[sonar-scanner扫描代码时间过长]]></title><link>https://blog.youkuaiyun.com/AM1n98/article/details/146210648</link><guid>https://blog.youkuaiyun.com/AM1n98/article/details/146210648</guid><author>AM1n98</author><pubDate>Wed, 12 Mar 2025 17:45:09 +0800</pubDate><description><![CDATA[代码越来越多，sonar扫描时间也越来越久，看了下sonar-scanner扫代码一次16分钟左右了。看了下扫描日志，发现扫了一些项目中留存但是没有使用的代码，所以需要让sonar忽略对这些代码的扫描。扫描时长缩短了一分半！杯水车薪，继续探索其他方法...1. 工程根目录下新建。]]></description><category></category></item><item><title><![CDATA[利用v-focus-next指令实现Form表单回车后聚焦下一个元素]]></title><link>https://blog.youkuaiyun.com/AM1n98/article/details/143843951</link><guid>https://blog.youkuaiyun.com/AM1n98/article/details/143843951</guid><author>AM1n98</author><pubDate>Mon, 18 Nov 2024 09:26:42 +0800</pubDate><description><![CDATA[v-focus-next是一个Vue指令，使用该指令后，在表单的某个元素中输入回车符，可以自动聚焦到下一个表单元素，避免了用户通过鼠标来回选中表单元素，大大提升了表单填写的效率和用户体验。v-focus-next的使用非常简单，只需要为某个Dom或Vue组件（如div、form、ElForm等）绑定v-focus-next指令，则该Dom下的所有input/textarea自动支持回车聚焦功能，无需任何其他配置。]]></description><category></category></item><item><title><![CDATA[Eslint保存自动格式化]]></title><link>https://blog.youkuaiyun.com/AM1n98/article/details/143411014</link><guid>https://blog.youkuaiyun.com/AM1n98/article/details/143411014</guid><author>AM1n98</author><pubDate>Thu, 31 Oct 2024 17:56:23 +0800</pubDate><description><![CDATA[项目根目录下配置.eslintrc.js。ctrl+shift+p 打开 首选项：打开工作区设置。2. 配置.eslintrc.js文件。3. 配置setting.json。1. 下载Eslint插件。4. 启用保存自动格式化。]]></description><category></category></item><item><title><![CDATA[【安全】前端如何安全存储密钥，防止信息泄露]]></title><link>https://blog.youkuaiyun.com/AM1n98/article/details/143372767</link><guid>https://blog.youkuaiyun.com/AM1n98/article/details/143372767</guid><author>AM1n98</author><pubDate>Wed, 30 Oct 2024 20:19:12 +0800</pubDate><description><![CDATA[把公钥写在前端代码文件里被公司检测到了要整改，整理几种常见的前端密钥存储方案。]]></description><category></category></item><item><title><![CDATA[el-autocomplete循环自动输入框相关，及与el-select同异]]></title><link>https://blog.youkuaiyun.com/AM1n98/article/details/143212281</link><guid>https://blog.youkuaiyun.com/AM1n98/article/details/143212281</guid><author>AM1n98</author><pubDate>Fri, 25 Oct 2024 11:22:51 +0800</pubDate><description><![CDATA[选择选项时组件本身会发出一个blur事件，且blur早于change，校验的是旧值，是el-autocomplete组件本身的坑，最后只能给在blur回调里写settimeout从而晚一点校验。（2） 数组中元素请注意格式，每个元素必须得有value字段，最终选中的value值会自动赋值给v-model的值。（1）要注意fetch-suggestions属性，它对应的接收函数中，需要执行cb()回调函数，来把数组返回到cb的回调参数中。备注：这里所说的数组，指的就是下拉项列表对应的数组。]]></description><category></category></item></channel></rss>