一个菜鸟的互联网技术分享博客
您的位置: 主页 > 使用vue全家桶高仿小米商城--接口错误拦截
advertisement

使用vue全家桶高仿小米商城--接口错误拦截

1、统一报错
2、未登录统一拦截
3、请求值、返回值统一处理

在main.js(如下图所示)加入下面代码:


代码如下:

  1. import Vue from 'vue'  
  2. import router from './router'  
  3. import axios from 'axios'  
  4. import VueAxios from 'vue-axios'  
  5. import App from './App.vue'  
  6.   
  7. //根据前端的跨域方式做调整 /a/b : /api/a/b  
  8. axios.defaults.baseURL = '/api';  
  9. //请求超时  
  10. axios.defaults.timeout = 8000;  
  11. //接口错误拦截  
  12. axios.interceptors.response.use(function(response){  
  13.     let res = response.data;  
  14.     if(res.status == 0){  
  15.         return res.data;  
  16.     }else if(res.status == 10){  //未登入  
  17.         window.location.href = '/#/login';  
  18.     }else{  
  19.         alert(res.msg);  
  20.     }  
  21. });  
  22.   
  23. Vue.use(VueAxios,axios);  
  24. Vue.config.productionTip = false  
  25.   
  26. new Vue({  
  27.   router,  
  28.   render: h => h(App),  
  29. }).$mount('#app')  

zhangren.online
上一篇:使用vue全家桶高仿小米商城--Storage封装
下一篇:使用vue全家桶高仿小米商城--接口环境设置

您可能喜欢

​vue中非父子组件传值

​vue中非父子组件传值

​vue中ref的使用

​vue中ref的使用

回到顶部