zoukankan      html  css  js  c++  java
  • VUE AXIOS封装三

    处理反复点击,以及错误拦截

    import axios from 'axios'
    import { API } from '@commons/constants'
    import isEmpty from 'lodash/isEmpty'
    
    const Service = {
      API: API,
    
      REQUEST_CACHE: {}, // API请求池
    
      METHODS: {
        GET: 'get',
        POST: 'post',
        DELETE: 'delete',
        PATCH: 'patch',
        PUT: 'put'
      },
    
      generateDefaultConfig () {
        return {
          isRequest: false
        }
      },
      has: function (key) {
        return !!this.REQUEST_CACHE[key]
      },
    
      gather (config) {
        let key =
          config.url +
          (isEmpty(config.params) ? '' : JSON.stringify(config.params))
        if (!this.has(key)) {
          let ajaxConfig = this.generateDefaultConfig()
          Object.assign(ajaxConfig, config, { key })
          this.REQUEST_CACHE[key] = ajaxConfig
        }
        return key
      },
    
      get (url, params, method) {
        let key = this.gather({ url, params, method: method || this.METHODS.GET })
        return this.request(key)
      },
    
      post (url, params) {
        return this.get(url, params, this.METHODS.POST)
      },
    
      put (url, params) {
        return this.get(url, params, this.METHODS.PUT)
      },
    
      delete (url) {
        return this.get(url, {}, this.METHODS.DELETE)
      },
    
      patch (url, params) {
        return this.get(url, params, this.METHODS.PATCH)
      },
    
      request (key) {
        let config = this.REQUEST_CACHE[key]
        return new Promise((resolve, reject) => {
          if (!config.isRequest) {
            config.isRequest = true
            // 处理两个系统不同的请求
            let param = null;
            if(config.key.indexOf('/rbac') > -1){
              param = config.params;
            }else{
              param = {...config.params};
            }
            axios[config.method.toLowerCase()](this.API + config.url,  param)
              .then(res => {
                this.reset(key)
                resolve(res)
              })
              .catch(err => {
                this.reset(key)
                return reject(err)
              })
          }
        })
      },
    
      reset (key) {
        this.REQUEST_CACHE[key] = null
      }
    }
    
    /**
     * 对外暴露的API
     */
    
    export default {
      get: Service.get.bind(Service),
      post: Service.post.bind(Service),
      delete: Service.delete.bind(Service),
      patch: Service.patch.bind(Service),
      put: Service.put.bind(Service)
    }
  • 相关阅读:
    C#中int和System.Int32理解总结
    谈C#中的Delegate
    Html的安全隐患
    Oracle性能优化
    Selenium私房菜系列7 深入了解Selenium RC工作原理(2)
    java取整和java四舍五入方法
    Android SufaceView 背景设置透明
    android图片加水印,文字
    关于android集成开发环境引入jar包错误的问题
    android bitmap绘制文字自动换行
  • 原文地址:https://www.cnblogs.com/tylz/p/11858463.html
Copyright © 2011-2022 走看看