vue 項目 api 統一管理

因爲項目遷移所以進行api統一管理

api 文件夾下

index.js

import request from '@/lib/request.js'
import product from './product.js'

function ajax (params, options = {}) {
  if (params) {
    if (options.method === 'post') {
      if (options.isConcat) {
        options = concatParams(options, params)
      } else {
        options.data = params
      }
    } else {
      options.params = params
    }
  }
  return request(options)
}

function concatParams (options, params) {
  let concatUrl = ''
  for (let i in params) {
    concatUrl = concatUrl + `&${i}=${params[i]}`
  }
  if (options.url.indexOf('?') > -1) {
    options.url = `${options.url}${concatUrl}`
  } else {
    options.url = `${options.url}?${concatUrl.substring(1)}`
  }
  return options
}

const apiAll = {
  ...product
}
let apis = {}
for (let i in apiAll) {
  apis[i] = function (params) {
    return ajax.bind(this, params, apiAll[i])()
  }
}
export default apis

其他 api

export default {
  disAndEier: {
    url: `/tp/supr/dis`,
    method: 'post',
    isConcat: true
  }
}

axios 請求

import axios from './axios'

const ajax = axios.create({
  timeout: 5000 // 請求超時時間
})

/**
 * 實例配置
 */
// request攔截器
ajax.interceptors.request.use(config => {
  return config
}, error => {
  // Do something with request error
  console.log(error) // for debug
  Promise.reject(error)
})

// respone攔截器
ajax.interceptors.response.use(
  response => {
    const res = response.data
    return res
  },
  error => {
    return Promise.reject(error)
  }
)

export default ajax

main.js

import api from '@/api'

Vue.prototype.$api = api

具體使用

 await this.$api.disAndEier({id: 1}) 配合async使用