1.在src文件中新建untils文件夾 新建axios.js文件
import axios from 'axios';
//設(shè)置axios
const service=axios.create({
timeout:1000*60,
baseURL:'/api',//對(duì)axios發(fā)送的請(qǐng)求路徑進(jìn)行集中設(shè)置
//意思是在接口路徑前加上/api
//這里的 /api 是和vue.config.js中proxy 中設(shè)置的對(duì)應(yīng)
})
//封裝post請(qǐng)求
let post=function(url,data_={}){
return new Promise((resolve,reject)=>{
service.post(url,data_).then((res)=>{
return resolve(res)
}).catch((err)=>{
return reject(err)
})
})
}
//封裝get請(qǐng)求
let get=function(url,params){
return new Promise((resolve,reject)=>{
service.get(url,{params}).then((res)=>{
return resolve(res)
}).catch((err)=>{
return reject(err)
})
})
}
//請(qǐng)求攔截
service.interceptors.request.use(config=>{
//添加請(qǐng)求頭
config.headers={
"Authorization":localStorage.token
}
return config
},err=>{
return Promise.reject(err)
})
//添加響應(yīng)攔截
service.interceptors.response.use(res=>{
return res.data
},err=>{
return err
})
export default{
post,
get
}
2.對(duì)請(qǐng)求方法進(jìn)行二次封裝
- 2.1 在src中新建api文件
- 2.2在api文件夾中新建文件 最好每個(gè)表格的接口寫一個(gè)文件
//引入封裝好的axios
import axios from '@/untils/axios';
//添加分類
function add_(data){
return axios.get('/goodstype/add',data)
}export{
add_ as add,
}
3.在vue文件中使用接口
import { add } from "@/api/goods";
async function(){
let res=await add({
//需要傳的參數(shù)
})
}
