这个异步问题你肯定遇到过，但是会解决的并不多

大家肯定遇到过这样类似的场景：多个 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.');

用法还是挺简单的，对于可能会出现异步竞态的情况下大家可以采用这个方法来解决。简单好用，还不会影响用户体验，封装下代码就能用起来了。

这个异步问题你肯定遇到过，但是会解决的并不多相关推荐

Word转PDF失败，报错Adobe Acrobat没激活！！！我如此穷，肯定会换个办法解决呀！
Word转PDF失败,报错关于Adobe Acrobat!!!我如此穷,肯定会换个办法解决呀! 先上成果先上成果查看了相关参考,提示安装一个microsoft save as pdf or xps ...
前端异步请求数据未获取导致报错解决办法
我们在编写前端程序的时候,往往需要异步请求后端数据,然后拿着得到的数据重现渲染页面.有的时候,数据还没有获取到,这个时候会是undefined形式.比如说,let test = "123&q ...
vue 表格中有列需要异步加载_Vue中使用async/await解决异步请求问题
1.async/await场景用同步的思维来解决异步问题,当前端接口调用需要等到接口返回值以后渲染页面. 2.名词解释 async async的用法,它作为一个关键字放到函数前面,用于表示函数是一个 ...
异步 HttpContext.Current实现取值的方法(解决异步Application,Session,Cache...等失效的问题)...
在一个项目中,为了系统执行效率更快,把一个经常用到的数据库表通过dataset放到Application中,发现在异步实现中每一次都会出现HttpContext.Current为null的异常,后来在 ...
FPGA之道（15）组合逻辑与时序逻辑、同步逻辑与异步逻辑的概念
组合逻辑电路与时序逻辑电路数字电路根据逻辑功能的不同特点,可以分成两大类:一类叫做组合逻辑电路,简称组合电路或组合逻辑:另一类叫做时序逻辑电路,简称时序电路或时序逻辑. 如果数字电路满足任意时刻的输 ...
dart系列之:dart中的异步编程
文章目录简介为什么要用异步编程怎么使用 Future 异步异常处理在同步函数中调用异步函数总结简介熟悉javascript的朋友应该知道,在ES6中引入了await和async的语法,可 ...
同步逻辑电路和异步逻辑电路
同步逻辑只被一个时钟信号驱动的设计称为同步逻辑,因为所有的记忆元素(比如寄存器.RAM.锁存器等)都被同一个时钟信号驱动,他们的输出都是同时变化的,因此对数字电路的影响也是同步的.典型的同步逻辑电路 ...
停止使用C#异步流保存到磁盘
目录这些是什么? 晦涩的语言功能:认识真实世界将内容捕获为流? 异步消费异步限制又一陷阱结论我用一个新的语言特性解决一个困难的性能问题的旅程:异步流.解释什么是异步流,并展示了它们可以解决 ...
FPGA之组合逻辑与时序逻辑、同步逻辑与异步逻辑的概念
组合逻辑电路与时序逻辑电路数字电路根据逻辑功能的不同特点,可以分成两大类:一类叫做组合逻辑电路,简称组合电路或组合逻辑:另一类叫做时序逻辑电路,简称时序电路或时序逻辑. 如果数字电路满足任意时刻的输 ...

这个异步问题你肯定遇到过，但是会解决的并不多

这个异步问题你肯定遇到过，但是会解决的并不多相关推荐

最新文章

热门文章