这个异步问题你肯定遇到过,但是会解决的并不多
2023-03-14 09:33:15 时间
大家肯定遇到过这样类似的场景:多个 Tab 页点击切换功能,如果用户点击频繁,很可能会出现当前页面显示别的页面的数据。
因为每个接口返回信息的时间是不同的,你不能保证先请求的一定最先返回数据,那么就很可能会出现停留在页面一却出现别的页面的数据的情况。这种异步的情况术语称之为异步竞态。
这时肯定有读者会说了,这还不简单,我能给你轻松想出好几个解决办法。
节流、防抖、加 Loading!
这些做法固然能解决问题,但是都治标不治本,而且还影响了用户体验,其实还有种办法能够完美解决问题:取消请求。
当然了这个取消请求它只是不继续处理接口后续的响应了,并不是真的把请求给取消了。毕竟请求如果已经发出去的话,我们也不能顺着网线把它追回来。
我们这边以 axios 为例来看看怎么取消请求:
- const CancelToken = axios.CancelToken;
- const source = CancelToken.source();
- axios.get('/user/12345', {
- cancelToken: source.token
- }).catch(function (thrown) {
- if (axios.isCancel(thrown)) {
- console.log('Request canceled', thrown.message);
- } else {
- // handle error
- }
- });
- axios.post('/user/12345', {
- name: 'new name'
- }, {
- cancelToken: source.token
- })
- // cancel the request (the message parameter is optional)
- source.cancel('Operation canceled by the user.');
用法还是挺简单的,对于可能会出现异步竞态的情况下大家可以采用这个方法来解决。简单好用,还不会影响用户体验,封装下代码就能用起来了。
相关文章
- 数据孤岛是业务效率的无声杀手
- 2023展望:新的一年将给大数据分析领域带来什么?
- 阿里云ADB基于Hudi构建Lakehouse的实践
- 大数据在医疗保健领域的使用案例
- 微软增加说明:KB5021751 更新扫描已经 / 即将过时 Office 过程中不会触碰用户隐私
- 2022 Gartner全球云数据库管理系统魔力象限发布 腾讯云数据库入选
- 场景化、重实操,分享一个实时数仓实践案例
- Arctic的湖仓一体践行之路
- 分布式计算MapReduce究竟是怎么一回事?
- 淘系数据模型治理优秀实践
- 大数据分析对医疗保健的影响
- 当我们说大数据Hadoop,究竟在说什么?
- 2022年及以后大数据的五个发展趋势
- 网易严选离线数仓治理实践
- 2023 年数据治理趋势
- 一份“靠谱”的年度经营计划,你学会了吗?
- 漫谈对大数据的思考
- 测试一下,读懂数据的能力,你有吗?
- 用艺术的眼光探索数据之美
- 聊聊数据分析成果如何落地