使用npm安装axios
npminstallaxiossrc/utils/request.js请求标头、请求拦截器和响应拦截器
importaxiosfrom ' axios ' constservice=axios.create ({ base URL : process.env.base _ API， timeout: 3 * 1000} ) config.headers={//' content-type ' : ' application/x-www-form-urlencoded ' /配置配置请求头} return config}，error={promise.reject(error ) }/4 .导入文件exportdefaultservicesrc/uttor
//封装的axios实例importrequestfrom './request ' const http={/* * * methods 3360请求* @param url请求地址* @param params请求get (() ) ) ) ) ) ) ) params (const config={ method : ' get '，URL:URL}if(Params ) config.params=Params ({ const config={ method : ' post '，URL:URL}if ) params ) config.data=paramsreturnrequest ) Params (。 Params ({ const config={ method : ' delete '，URL:URL}if ) params ) config.params=paramsreturnrequest ) config 自定义方法名称。 这样使用时，直接导入api.js文件即可
importhttpfrom ' ./utils/http '/* * @ parmsresquest请求地址示例： 3358197.82.15.1533608088/request/. * @ param '/letresquest=' http://XXX.XXX.XXX.XXX 33608090/API '/XXX的位置是从后端ip//名称获取员工信息的exportfunction racernametx { return } //从姓名获取员工信息exportfunctionracerquerytabelapi (params ) ) returnhttp.get ) ` ${resquest}/racer/query `， (params ) /修改员工信息exportfunctionracerupdateapi (params ) ) returnhttp.post ) ` ${RESquest}/racer/update `， (params ) /与队长姓名相对应的团队资料exportfunctionleadertabelapi (params ) return http.get ` $ { RES quest }/team/leader //wmdls名称对应的团队资料exportfunctionmatetabelapi (params ) returnhttp.get ) ` resquest )/team/mate `， (params ) /团队数据exportfunctionteamupdateapi (params ) ) returnhttp.post ) ` $(RESquest )/team/team/update `，' //导入或importapifrom ' @/API/API ' API.racernametabelapi (.then ) )导入) racernametabelapi， 使用racerqueerapi )的leaderTabelAPI、mateTabelAPI、teamupdateapi } from ' @/API/API '//这是要调用的方法teamTrueHandle () letobj=oobj obj temp (teamupdateapi (obj ).then ) RES={ if } RES.data.result code==0) this.teamtabledata=RES
//proxy是处理跨域的module.exports={ devserver : } host : '0.0.0'，//从外部ip到port: 8080， /端口允许访问https : false//https proxy : { '/API ' : } target : ' http://XXX.XXX.XXX.XXX 33608090 '，CHX 要配置secure 3360 path rewrite : { ' ^/API ' : '/API ' } } axios，还可以使用多种直接拨打prototype的方法
//main.jsimportaxiosfrom ' axios ' vue.prototype.$ http=axios//有关使用的信息，请参阅this.$http.get(URL，{params: 实战项目的测试