Vue引入axios

安装axios

npm install axios -S

安装vue-axios

npm install vue-axios -S

引入axios对象并配置

新增文件/src/utils/axios/index.js

import axios from 'axios'  
import router from "@/router"  
import {Message} from "element-ui"  
  
axios.interceptors.response.use(response => {  
  return response  
}, error => {  
  if (error.response && error.response.status === 401) {  
    router.push('/login').then(() => Message({  
      message: 'Please login first.',  
      type: 'error'  
    }))  
  }  
  return Promise.reject(error)  
})  
  
export default axios

使用axios对象

通过vue-axios在Vue中全局使用axios

main.js

import Vue from 'vue'  
import App from './App.vue'  
import VueAxios from "vue-axios"  
import axios from "./utils/axios"  
  
Vue.config.productionTip = false  
Vue.use(VueAxios, axios)  
  
new Vue({  
  render: h => h(App)
}).$mount('#app')

可以在任何Vue组件中使用this.axios调用

在需要使用时手动引入

import axios from "@/utils/axios"  
  
export default {  
  getCorpusListByParentId(parentId, successHandler, failHandler) {  
    axios.get('api/corpus', {  
      params: {  
        parentId: parentId === undefined ? 0 : parentId  
      }  
    }).then(successHandler).catch(failHandler)  
  }  
}

PREVIOUSFont Awesome使用

NEXTaxios模块化使用