一转眼Vue 3.0都要发布了,学习使用Vue也有一段时间了,记录一下axios的用法
Axios 是一个基于 Promise 的 HTTP 库，可以用在浏览器和 node.js 中,有点类似于ajax,但是在MVVM模式中,使用axios是有好处的
1.从浏览器中创建 XMLHttpRequest
2.支持 Promise API
3.客户端支持防止CSRF
4.提供了一些并发请求的接口（重要，方便了很多的操作）
5.从 node.js 创建 http 请求
6.拦截请求和响应
7.转换请求和响应数据
8.取消请求
9.自动转换JSON数据
ajax相对axios的缺点有
1.本身是针对MVC的编程,不符合现在前端MVVM的浪潮
2.基于原生的XHR开发，XHR本身的架构不清晰。
3.JQuery整个项目太大，单纯使用ajax却要引入整个JQuery非常的不合理（采取个性化打包的方案又不能享受CDN服务）
4.不符合关注分离（Separation of Concerns）的原则
5.配置和调用方式非常混乱，而且基于事件的异步模型不友好。
当然ajax也是有优点的
1.异步请求，不妨碍用户浏览页面或者其他操作。
2.局部刷新，无需重新刷新页面。
3.界面与应用分离。有利于分工合作、减少非技术人员对页面的修改造成的WEB应用程序错误、提高效率、也更加适用于现在的发布系统。
4.基于标准被广泛支持。
5.前端和后端负载平衡。最大程度的减少冗余请求和响应对服务器造成的负担，提升站点性能。
一、axios获取数据的例子
axios.get("/static/data").then(function(res) {
var data = res.data.data.list;
for (var i = 0; i < data.length; i++) {
if (data[i].id == id) {
_this.o1.push(data[i]);
}
}
});
二、axios通过get方式返回值
1.通过url返回参数
axios.get('/user?ID=12345')
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
2.通过params传递参数
axios.get('/user', {
params: {
ID: 12345
}
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
三、axios通过post方式返回值
axios.post('/user', {
firstName: 'Fred', // 参数 firstName
lastName: 'Flintstone' // 参数 lastName
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});