问答

网络延迟用户多次点击,是否需要对所有click事件进行节流操作

作者:admin 2021-09-08 我要评论

当前状况:用户在点击按钮保存,无唯一性约束的信息时,前端发送请求,请求成功的回调函数内将按钮隐藏。 遇到问题:网络响应慢时,前端未立即触发成功回调。导...

在说正事之前,我要推荐一个福利:你还在原价购买阿里云、腾讯云、华为云服务器吗?那太亏啦!来这里,新购、升级、续费都打折,能够为您省60%的钱呢!2核4G企业级云服务器低至69元/年,点击进去看看吧>>>)

当前状况:用户在点击按钮保存,无唯一性约束的信息时,前端发送请求,请求成功的回调函数内将按钮隐藏。
遇到问题:网络响应慢时,前端未立即触发成功回调。导致用户多次点击。
解决方案:1.节流或防抖处理 2. 加loading,禁用按钮,控制按钮可用性
扩展问题:节流,防抖,状态控制,哪一种处理方式,更合理一些?是否要为网络延迟导致的用户的误操作都做一下类似处理。

###

个人建议 这里采用加loading的方式,用户体验更好,让用户知道她的点击是有效的(页面有相应的反馈)

节流、防抖 一般是用于事件频繁触发导致回调函数频繁执行的情况,虽然你这个案例中也存在频繁click的情况,但是你这里其实是可以避免频繁click的,比如loading状态下的按钮禁止点击,而且最主要的是这里你不需要用户频繁的点击,所以说loading的方式更好,扯远了;节流、防抖适用于事件频繁触发导致回调函数频繁执行的情况,比如页面搜索框用input事件的时候,其实可以改成change事件,当然非要用input又不想让回调频繁执行,可以采用防抖处理,再比如页面的滚动事件和它的回调处理函数就适合用节流、防抖。

推荐 如果对节流、防抖不是很了解,推荐阅读JavaScript 节流、防抖

版权声明:本文转载自网络,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。本站转载出于传播更多优秀技术知识之目的,如有侵权请联系QQ/微信:153890879删除

相关文章
  • 网络延迟用户多次点击,是否需要对所有

    网络延迟用户多次点击,是否需要对所有

  • 本地用script引用vue,Vue对象没有挂载

    本地用script引用vue,Vue对象没有挂载

  • 移动端ui组件库为什么不使用flex布局

    移动端ui组件库为什么不使用flex布局

  • 怎么才能看到别人的小程序调用的接口地

    怎么才能看到别人的小程序调用的接口地

腾讯云代理商
海外云服务器