接口三层封装:
工具函数层:
/**
* axios请求的工具函数
* 2019-11-13 by 小貂蝉
*/
// 引入核心库
import axios from 'axios'
import qs from 'qs'
// 引入ui组件
import { Message } from 'element-ui'
// 设置请求的服务器根路径
axios.defaults.baseURL = 'http://127.0.0.1:5000'
// 设置请求超时
axios.defaults.timeout = 3000;
// 设置请求拦截器(在请求发送出去之前 带上一些东西)
axios.interceptors.request.use(cofing => {
return cofing;
}, err => Promise.reject(err))
// 设置响应拦截器 在接收到后端的响应结果以后 统一处理
axios.interceptors.response.use(response => {
// 拦截数据 统一处理
let { code, msg } = response.data;
if (code === 0) {
Message({ type: 'success', message: msg })
}
return response
}, err => Promise.reject(err))
// get和post请求
export default {
get(url, params = {}) {
return new Promise((resolve, reject) => {
axios.get(url, { params })
.then(response => {
resolve(response.data) // 成功
})
.catch(err => {
reject(err) // 失败
})
})
},
post(url, params = {}) {
return new Promise((resolve, reject) => {
axios.post(url, qs.stringify(params))
.then(response => {
resolve(response.data) // 成功
})
.catch(err => {
reject(err) // 失败
})
})
}
}
接口层
/**
* 接口层,所有账号管理模块相关的请求函数 都在这里哦!!!
*/
// 引入工具函数
import req from '../utils/request'
/* 添加账号 */
export const addAccount = params => req.post('/users/accountadd', params)
/* 获取账号列表 */
export const getAccountList = params => req.get('/users/accountlist', params)
/* 删除账号 */
export const delAccount = params => req.get('/users/accountdel', params)
/* 批量删除账号 */
export const batchDelAccount = params => req.get('/users/accountbatchdel', params)
/* 修改账号 */
export const editAccount = params => req.post('/users/accountedit', params)