交互

表格多选功能搞死我了，全选按钮各种bug 最近做一个后台管理界面，表格多选功能把我整得够呛。本来以为就是简单的checkbox操作，结果各种边界情况和状态同步问题让我折腾了两天。 最大的问题是全选按钮...

高亮显示？别被花里胡哨的方案绕晕了 最近在做一个文档搜索功能，用户输入关键词后要高亮匹配内容。看似简单，但实际做起来发现坑不少。我试过好几种方案：纯 CSS、正则替换、第三方库（比如 mark.js）...

优化前：卡得不行 上周我接手一个老项目，里面有个全文搜索功能，用户一输入就卡成PPT。页面直接冻结1秒以上，键盘输入都延迟，连光标都懒得动。测试同事说“这体验不如不用”，我点开 DevTools 一看...

又踩坑了，下拉刷新把页面滚动搞崩了 昨天在给一个移动端列表页加下拉刷新功能，本来以为就是个简单活儿，结果折腾了大半天，差点把键盘砸了。问题出在：我加完下拉刷新后，页面的正常滚动突然失效了，手指一滑，页...

为什么选 requestAnimationFrame？ 上个月接了个需求，要做一个自定义的滚动条组件，支持平滑滚动、惯性回弹、还有滚动过程中的实时监听。一开始我直接用 scroll 事件加 setTi...

优化前：卡得不行 上周上线一个商品列表页，用户反馈“一划就卡”“图片加载半天不动”。我本地跑起来也确实离谱——首屏还没出来，浏览器已经卡到鼠标都转圈。打开 DevTools 一看，Network 里堆...

又踩坑了，OSS上传文件跨域报错 上周在给一个项目加图片上传功能，前端直接用阿里云OSS的Web直传，结果一上传就报CORS错误。控制台红了一片，Access to XMLHttpRequest at...

我的写法，亲测靠谱 折腾 ProseMirror 有段时间了，从一开始照着文档抄，到后来被各种诡异行为折磨得睡不着觉，踩过不少坑。现在总算摸出一套自己用着顺手的写法。先说最核心的一点：别在 Edito...

优化前：卡得不行 上周上线一个带 Timeline 时间轴的项目，结果 QA 一测就炸了：页面加载慢得离谱，滚动还卡成 PPT。我本地跑还好，一到低端机上直接卡死，连点击都响应不了。用户反馈说“点一下...

先看效果，再看代码 上周做数据对比功能，客户要的是“一眼看出两个版本的差异”，不是那种表格里标红绿色的弱鸡方案。我一开始也想用现成的 diff 库，结果发现要么太重，要么不支持自定义样式，最后干脆自己...

先看效果，再看代码 最近在做一个文件管理器的交互优化，产品经理说：“双击打开文件夹，单击选中，这个很基础吧？” 我心想：不就是个 dblclick 事件嘛，能有多难？结果一上手就发现坑比想象中多。今天...

核心代码就这几行，但别急着复制 上周重构一个移动端商品详情页，需要实现一个带 sticky 效果的滚动区域。一开始我直接用原生 overflow-y: scroll，结果在 iOS 上卡成 PPT，手...

为啥选了 Anime.js？ 最近做完一个偏展示型的落地页项目，客户想要一些“有点动感但别太花”的交互动画。一开始我本能地想用 CSS keyframes + transition 搞定，毕竟轻量、性...

又踩坑了，Summernote 里粘贴图片上传老是失败 上周在搞一个富文本编辑器的功能，用的是 Summernote。本来以为就是个常规需求：用户粘贴图片，自动上传到服务器，返回 URL 插入编辑器。...

我的写法，亲测靠谱 做前端这些年，处理搜索排序功能踩过不少坑。最开始我以为不就是个 sort() 的事嘛，结果线上用户一多、数据一杂，各种诡异问题就来了。后来我总结出一套自己用着顺手的写法，稳定、可维...

又踩坑了，多点触控手势识别乱成一锅粥 上周在搞一个画板功能，用户要在手机上用两个手指缩放、旋转画布。听起来挺简单的对吧？结果 touchstart、touchmove、touchend 一套下来，手指...

导入导出这事儿，我折腾过好几轮 做前端这几年，但凡碰上数据管理类的项目，十有八九要搞导入导出。用户总想把表格数据导成 Excel，或者从本地 Excel 上传一批数据进来。刚开始我都是现查现用，后来发...

我的写法，亲测靠谱 在做加载状态、骨架屏或者提示弹窗这类交互时，我经常遇到一个坑：内容加载太快，用户根本没看清提示就消失了。反过来，如果加载慢，又不能卡太久不让走。这时候就得用“最小展示时间”来平衡体...

又踩坑了，WangEditor 上传图片后光标乱跑 上周在项目里集成 WangEditor，本来以为就是个富文本编辑器，复制粘贴图片、拖拽上传，搞定收工。结果测试一跑，发现上传完一张图，光标直接跳到文...

先看效果，再看代码 上周接到一个需求：让用户自己拖拽组件生成表单，支持保存、预览、导出 JSON。听起来很常见，但真做起来才发现坑不少。我折腾了三天，最后用原生 JS + Vue3 搞定了一套轻量方案...