2019-04-24 关于点赞与取消赞按钮的设计
2019-04-24 本文已影响0人
东方吴愧
如何设计的优雅 点赞/取消赞，开关切换 的请求的发送
开关切换
页面上：用户每次点击都会切换switch开关的状态；
接口上：每次响应成功之后才能去切换switch的状态；
使用场景：用户会习惯性狂点switch直到switch切换，但是由于用户点击速度过快，
上次点击的响应还没回来，用户就又发送了一个或者多个请求，导致接口报错！
从前端角度，如何规避这些问题，并让用户体验最佳 (*❦ω❦)？？？
1.错误写法
图1：错误代码
如上图1：菜鸟级写法：就当做普通发送请求就完事了，啥也不管！~
结果使用的时候各种报错，点的越快，报错越多，约点越闹心，QAQ··
2.正确姿势（控制用户的点击操作）
图2：页面代码
图3：代码
如图3：我们通过给switch添加disabled属性来控制用户的连续点击，防止用户重复提交；
思路：用户每次点击完，disabled属性设置为true，不再让用户操作，直到响应回来之后，
将disabled恢复为false，可让用户操作，从而发送请求！
Tips:这个disabled属性直接绑定在每个switch所在数据对象上
