美文网首页前端Vue收藏的
Vue 封装axios实现多个请求合并为一次 loading

Vue 封装axios实现多个请求合并为一次 loading

作者: 月_关 | 来源:发表于2019-11-01 14:59 被阅读0次

    需求

    请求开始的时候开始 loading, 然后在请求返回后结束 loading。

    重点就是要拦截请求和响应。

    然后,要解决多个请求合并为一次 loading。

    最后 loading 组件即可。

    1.引入axios实例创建

    1

    2.axios 提供了请求拦截和响应拦截的接口,每次请求都会调用startLoading方法,每次响应都会调用endLoading方法,我们封装一下这俩个方法

    注意:startLoading endLoading要干的事儿就是将同一时刻的请求合并。声明一个变量reqNum,每次调用startLoading方法 reqNum + 1。调用endLoading()方法,reqNum - 1。reqNum为 0 时,结束 loading。要合并一定延时的请求 我们可以加入一个延时。

    2

    3.请求拦截器

    3

    4.响应拦截器

    4

    5.提供方法api

    5

    git地址 https://github.com/caozhenhui/axios.git

    相关文章

      网友评论

        本文标题:Vue 封装axios实现多个请求合并为一次 loading

        本文链接:https://www.haomeiwen.com/subject/kygfbctx.html