怎么在Vue中使用axios组件
怎么在Vue中使用axios组件:
通过npm安装axios
npm i axios
在 src/main.js
中导入该组件
import axios from 'axios'
axios常用请求
GET :
// 为给定 ID 的 user 创建请求
axios.get('/user?ID=12345')
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
// 上面的请求也可以这样做
axios.get('/user', {
params: {
ID: 12345
}
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
POST :
// 参数在 url 后通过对象指定
// 发送 Form Data 数据,要使用 qs包
/*
1、npm i qs
2、main.js 中引入这个包: import qs from "qs"
3、将qs设置为Vue的属性: Vue.prototype.$qs = qs
*/
let data = this.$qs.stringfy({
firstName: 'Fred',
lastName: 'Flintstone'
})
axios.post('/user', data)
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
PUT :
axios.put()
DELETE :
axios.delete()
axios 全局配置
import axios from 'axios'
// axios全局配置
Vue. prototype. $http = axios
axios. defaults. baseURL = host
// 配置该Content-Type后请求的post数据默认为 FormData 格式
axios. defaults. headers[ 'Content-Type'] = 'application/x-www-form-urlencoded'
axios. defaults. headers[ 'XPS-Version'] = '1.0.0'