axios 使用实例

axios在vue项目中使用

axios基本的使用,就可以直接跳过了,可以参考一下官网,在自己vue spa 项目中用到了axios,因此记录一下。

Creating an instance

在项目中我的用法是创建一个实例

// Init Axios Vue.prototype.$http = axios.create({     baseURL: process.env.API_URL });

这个好处是我可以定制自己的公共配置项,官网也说明,only the url is required,以后所有的请求都可以基于这个配置项

Config order of precedence

这里还可以有配置优先

 Vue.prototype.$http.defaults.timeout=2500;   Vue.prototype.$http.get('/request',{   timeout:5000 })

interceptors

这个功能是我最喜欢的一个功能,对我而言,后端借口也是自己写的,那么来说,自己定义json 格式状态码都是有规定,那么在项目中,在请求和相应的时候,可以事先拦截做处理,直接上代码:

  • 请求拦截:

//config 就是defaults.js里面所有的配置 Vue.protype.$http.interceptors.request.use(config=>{  //配合jwt   var token=window.localStorage.getItem('jwtToken');    if(token){        config.headers.Authorization=`Bearer ${token}`;   }   return config;  },error=>{   return Promise.reject(error); }) 
  • 响应拦截:

  axios.interceptors.response.user(res=>{  //相关处理 return res.data;  },error=>{     return Promise.reject(error); })

实质上这些处理已经够用了,如果没有你想要的,比如定制更多的配置项,这些都可以上官网上找到

good luck

脚本宝典为你提供优质服务
脚本宝典 » axios 使用实例

发表评论

提供最优质的资源集合

立即查看 了解详情