前端开发
最新文章
Token过期触发401时，若刷新令牌请求也被同一拦截器捕获，将导致无限重试循环。根本解法是创建纯净的、无响应拦截器的独立axios实例处理刷新请求，并添加_retry标记与URL排除双重防护，刷新失败时彻底清理状态并跳转登录页。
移动端双击缩放导致300ms点击延迟，通过`touch-action:manipulation`该属性可绕过浏览器等待期直接触发事件，从而解决延迟问题。需精准添加至交互元素，禁止全局设置，注意其继承性及浏览器兼容性，以避免破坏滚动或缩放功能。
利用`position:fixed`创建独立DOM层控制位移实现多层视差，避免使用`background-attachment:fixed`（不响应`z-index`且移动端失效）。背景固定仅限`body`或全屏容器。推荐采用滚动监听、`requestAnimationFrame`节流结合`background-position`像素值计算，该方案可解决多层
使用grid-template-areas固定侧边栏，避免其参与auto-fill计算导致小屏布局失控。主内容区内部嵌套auto-fill与minmax控制卡片列数。媒体查询小屏时隐藏侧边栏并调整grid-template-columns。注意IE11等兼容性降级，以及侧边栏隐藏时JS同步清理定时器或地图实例。
推荐使用rgba()或hsla()替代纯黑 000，选择比背景略深的灰，透明度控制在0 1-0 3之间，阴影更柔和自然。模糊值越大，透明度需越低，如模糊30px时alpha约0 05。此方法同样适用于内阴影和文字阴影，能有效提升界面质感，营造自然光影。
Bootstrap5的Tooltip在移动端默认通过点击事件触发，会导致闪现问题。方法为：使用manual模式，通过touchstart启动定时器，在touchend和touchmove时清除定时器，从而实现长按持续显示。需阻止默认事件，并注意避免与data属性混用，以免产生干扰或冲突。
Flex布局中，flex-basis优先级高于width，仅设为auto时回退到width。它沿主轴方向生效：水平轴覆盖width，垂直轴覆盖height。IE兼容性建议使用-ms-flex简写并保留width作为降级方案。
CSS的`scrollbar-gutter:stable`属性可预留滚动条空间，防止内容因滚动条出现消失而跳动。需配合`overflow-y:auto`生效，注意容器高度与子元素影响。`both-edges`适用于对称布局，普通场景用`stable`即可。对不支持的老浏览器，可用JS动态设置padding或`@supports`降级。
CSS变量在打印时不会自动切换值，必须在@mediaprint中用:root显式重定义。颜色、间距及隐藏控制类变量易出问题，需确保打印上下文中var()引用的变量有明确定义。调试时应通过DevTools检查最终计算值，并强制刷新预览。
在Less中处理带连字符或数字开头的CSS属性名时，编译器会误判为减法或非法标识符。解决方法是使用引号包裹整个属性名，变量声明也需带引号并用插值语法。属性名位置不支持动态构造，建议抽取为mixin复用。
在TailwindCSS中，唯一可靠禁用preflight的方法是设置preflight:false，此举将移除所有基础重置样式。关闭后，必须手动在@layerbase中补充关键重置样式，包括box-sizing、按钮背景等，以确保页面样式正常。此外，也可使用all:revert属性对特定区域进行局部隔离，避免全局样式干扰。
在表单交互场景中，经常需要根据用户输入实时控制提交按钮的可点击状态——例如输入字符数达到某个阈值才允许提交。但如果错误绑定 change 事件，会发现按钮状态更新总是滞后一拍，因为它仅在元素失去焦点时触发，键盘敲击半天按钮依然呈灰色不可用。正确的解决方案是监听 input 事件，该事件能在每次输入值
许多开发者在 React Hook Form 开发中常遇到一个棘手问题：手动输入的表单字段正常提交，但由 API 自动填充的字段却总是神秘丢失。本文将直接提供解决方案——使用 setValue 主动更新受控字段的值。 在 React Hook Form 中，每个表单字段需通过 register 注册
Express路由匹配遵循自上而下顺序，参数化路径如` api budget :year`会匹配字面量`search`，导致静态搜索接口被截胡。解决方案是将静态路由定义在动态路由之前，并加强参数校验，确保精确路径优先执行。
探讨一个实战问题：为何要在HTML注释中记录版本信息？项目上线后，运维、测试甚至开发者本人，几天后回顾线上源码时，往往难以确定当前运行的版本。打包文件常包含哈希值，浏览器缓存策略多变，构建日志可能早已清除——此时，嵌入HTML注释中的版本号堪称救命稻草。 然而，许多人虽知注释可存储版本号，却不清楚如