VueAxios的使用
第一步:安装
npm install --save axios vue-axios
第二步:在入口文件main.js中配置
import Vue from 'vue'
import axios from 'axios'
import VueAxios from 'vue-axios'
Vue.use(VueAxios, axios)
第三步:使用方式有如下三种
方式1 经验证失败
Vue.axios.get(api).then((response) => {
console.log(response.data)
})
方式2
this.axios.get(api).then((response) => {
console.log(response.data)
})
方式3
this.$http.get(api).then((response) => {
console.log(response.data)
})
第一步:首先通过 npm 安装
npm install --save vue-axios-plugin
然后在main.js入口文件配置如下:
mport Vue from 'Vue'
import VueAxiosPlugin from 'vue-axios-plugin'
Vue.use(VueAxiosPlugin, {
// 第二步:请求拦截处理
reqHandleFunc: config => config,
reqErrorFunc: error => Promise.reject(error),
// 响应拦截处理
resHandleFunc: response => response,
resErrorFunc: error => Promise.reject(error)
})
第三步:使用案例
在 Vue 组件上添加了 $http 属性, 它默认提供 get 和 post 方法,使用如下
this.$http.get(url, data, options).then((response) => {
console.log(response)
})
this.$http.post(url, data, options).then((response) => {
console.log(response)
})
你也可以通过 this.$axios 来使用 axios 所有的 api 方法,比如:
this.$axios.get(url, data, options).then((response) => {
console.log(response)
})
this.$axios.post(url, data, options).then((response) => {
console.log(response)
})