交互
探索用户交互全链路疑问，解答交互设计、动效实现与体验优化中的各类交互难题。
-
1
回答
18浏览
滚动加载数据时怎么判断到底部了？
我在做列表页的滚动加载，监听 scroll 事件后用 window.innerHeight + window.scrollY >= document.body.offsetHeight 判断是否...
-
2
回答
869浏览
FileReader读取文件后为什么图片不显示？
我用FileReader读取用户上传的图片，但预览区域一直空白，控制台也没报错，到底是哪出问题了？ 我试过在onload回调里把result赋值给img的src，但就是不显示。HTML结构是这样的： ...
-
2
回答
41浏览
文件拖拽上传时怎么阻止浏览器默认打开文件？
我在做文件拖拽上传功能，但每次把图片拖进页面，浏览器就直接在新标签页打开了那张图，根本没法上传。我试过给容器加了 preventDefault()，但好像没生效。 这是我的 HTML 结构： <...
-
2
回答
30浏览
弹幕在视频播放时怎么做到不重叠还流畅滚动？
我正在做一个带弹幕功能的视频播放页，现在弹幕是用绝对定位从右往左移动的。但弹道（就是同一时间出现的弹幕行）经常互相覆盖，尤其是高密度的时候，看着特别乱。 我试过给每条弹幕动态计算 top 值避开已有弹...
-
2
回答
47浏览
表单提交后错误提示不消失怎么办？
我在用 React 做一个登录表单，提交失败时会显示错误提示，比如“用户名或密码错误”。但用户修改输入后，错误提示还一直显示着，体验很不好。 我试过在 input 的 onChange 里清空错误状态...
-
1
回答
29浏览
Shimmer加载效果在Vue里怎么实现才不卡顿？
我在用Vue做列表页的骨架屏，但加了Shimmer动画后页面明显变卡，尤其在低端手机上。是不是我的写法有问题？ 我试过用CSS动画配合v-for渲染多个占位块，但一滚动就掉帧。下面是我现在的代码： &...
-
2
回答
30浏览
Cesium中如何正确移除之前添加的Entity？
我在用Cesium做轨迹回放功能，每次重新加载数据前想清空之前的entity，但调用remove后地图上还是有残留，不知道是不是方法用错了。 我试过这样写： const entity = viewer...
-
2
回答
58浏览
TweenMax在React组件中动画不执行是怎么回事？
我在React里用TweenMax给一个div加淡入动画，但页面加载后元素直接显示，完全没有动画效果。控制台也没报错，我试过把动画逻辑放到useEffect里，也检查了ref是否正确绑定，但就是不动。...
-
2
回答
24浏览
Hammer.js 手势识别在某些元素上不生效是怎么回事？
我用 Hammer.js 给一个 div 加了 pinch 和 pan 手势，但在真机上测试时发现有时候手势完全没反应，尤其是当这个 div 有 overflow: hidden 的时候。我试过加 t...
-
1
回答
72浏览
WebSocket 接收消息后如何用消息队列避免页面卡顿？
我用 WebSocket 实时接收服务器推送的大量消息，但一收到数据就直接更新 DOM，页面明显卡顿。听说可以用消息队列缓冲处理，但不知道怎么在前端实现。 目前是这样直接处理的： socket.onm...
-
2
回答
30浏览
滚动指示器怎么实现才能实时反映页面滚动进度？
我最近在做个人作品集网站，想加个顶部的滚动进度条，就是那种随着页面往下滚，进度条从0%到100%慢慢变长的效果。试了用 window.scrollY 除以 document.body.scrollHe...
-
2
回答
391浏览
React里用xlsx导出Excel时中文乱码怎么办？
我在React项目里用xlsx库导出表格数据，英文和数字都正常，但中文全是乱码，试了网上说的encodeURI也不行，到底该怎么处理？ 我现在的代码是这样： import * as XLSX from...
-
2
回答
19浏览
为什么调用 window.print() 打印出来的样式和页面显示的不一样？
我在做一个订单详情页，点击打印按钮调用 window.print()，但打印预览里字体变小、布局错乱，明明页面上看着是正常的。是不是漏了什么打印专用的样式？ 我试过加 @media print，但效果...
-
1
回答
47浏览
表单提交失败后怎么优雅地恢复用户输入？
我做了一个带校验的注册表单，用户填完点提交，结果网络出错，页面刷新了，所有输入都没了。这体验太差了，用户肯定要骂人。 试过用 sessionStorage 临时存字段，但不知道该在什么时候清理，而且如...
-
1
回答
25浏览
分片上传时如何确保所有分片都成功上传了？
我用 JavaScript 做大文件分片上传，前端把文件切成 10MB 一块发给后端。但有时候网络不好，个别分片没传成功，但我不知道是哪一块丢了，最后合并就出错。 现在我在每个请求里加了 chunkI...
-
1
回答
153浏览
表单联动时下拉框选项不更新怎么办？
我在做省市区三级联动，选了省份后，城市下拉框没反应，明明数据已经拿到了。我用的是原生JS监听change事件，然后动态修改select的innerHTML，但页面就是不刷新。 试过console.lo...
-
2
回答
37浏览
Vue里怎么实现两个版本JSON数据的差异对比高亮显示？
我在做一个配置管理功能，需要对比用户修改前后的JSON数据，并把差异部分高亮出来。试了用deep-diff库拿到差异，但不知道怎么在页面上直观地展示出来，特别是嵌套对象的情况。 现在我的模板是这样写的...
-
2
回答
24浏览
Message消息提示为啥不显示？代码哪里写错了？
我用 Element Plus 的 Message 组件，点击按钮没反应，控制台也没报错，但就是看不到提示消息。是不是引入方式有问题？ 我已经按文档写了，但还是不行，下面是我的代码： <temp...
-
1
回答
35浏览
方向键监听在React里为啥不生效？
我在用React写一个简单的键盘导航组件，想通过方向键控制焦点移动，但 onKeyDown 事件根本没反应，是哪里写错了吗？ 我试过给 div 加 tabIndex，也用了 useCallback 包...
-
2
回答
34浏览
右键菜单怎么阻止默认浏览器菜单弹出？
我在做一个自定义右键菜单的功能，但每次右键点击时，浏览器自带的菜单还是会弹出来，盖住我自己的菜单。我试过用 preventDefault()，但好像没生效，是我哪里写错了吗？ 这是我的 HTML 结构...
