一、什么是axios
Axios 是一个基于 promise 的 HTTP 库，可以用在浏览器和 node.js 中。
axios原理 如下代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>axios原理</title>
</head>
<body>
<script>
// 原生ajax: XmlHttpRequest对象 异步请求对象
// 找对象 1:有目标对象 2：获取到联系方式 3：:发送请求 4： 等待回信-后端接口反馈
// 原生ajax四步骤：
// var xhr = new XMLHttpRequest();
// xhr.open('get',"http://127.0.0.1:3000",true) ;
// xhr.send(null);
// xhr.onreadystatechange = function(){
// if (xhr.readyState == 4 && xhr.status == 200) {
// xhr.responseText;
// }
// }
// 实现ajax的get请求： Ajax.get() axios.get()
var Ajax = {
get: function(url,fn){
var xhr = new XMLHttpRequest();
xhr.open('get',url,true) ;
xhr.onreadystatechange = function(){
if (xhr.readyState == 4 && xhr.status == 200) {
// 从服务端获取数据
fn.call(this, xhr.responseText)
}
};
xhr.send();
},
post: function(url,fn){
// 思路是一致的
}
}
// 封装Ajax,实现axios进行回调
var axios = {
get: function(url){
return new Promise((resolve,reject) => {
var xhr = new XMLHttpRequest();
xhr.open('get',url,true) ;
xhr.onreadystatechange = function(){
if (xhr.readyState == 4 && xhr.status == 200) {
// 从服务端获取数据
// fn.call(this, xhr.responseText)
resolve(xhr.responseText)
}
};
xhr.send();
})
},
post: function(url){
// 思路是一致的
},
put:function(url){
}
}
</script>
</body>
</html>
1591
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
