简单封装ajax
2018-11-22 本文已影响0人
easemeng
1.在eolinker上创建接口
(1)新建工作空间(第一次新建，之后是否新建视情况而定)
新建工作空间.png
(2)新建一个项目(第一次使用创建，之后是否创建视情况而定)
新建项目.png
新建项目2.png
(3)新建接口(新建一个分组，然后新建接口，之后是否新建分组视情况而定)
建接口.png
新建接口.png
(4)将复制好的json插入，并修改属性值()
导入json.png
插入json2.png
json3.png
2.在写好的接口中获取接口地址
获取接口地址.png
3.创建js文件封装ajax(地址中要去掉具体的URI)
(1)创建一个常量接收不确定的接口对象(没有具体的URI)
var baseUrl = "http://result.eolinker.com/UNPt9TGe1911deea5ab4b01704bbfe0b97948d26eb2d31d?uri=";
(2)具体的ajax方法(具体的url = 创建的常量 + 传入的url 使用回调函数输出)
function http({ url, type = "get", dataType = "json", data = {}, success }) {
$.ajax({
url: baseUrl + url,
type,
dataType,
data,
success: function (res) {
success(res);
}
})
}
4.调用封装好的ajax
(1)在head导入jQuery
bootcdn导入.png
复制标签.png
将复制好的标签粘贴在html文件的头部<head>标签中
(2)导入封装好的ajax(一定要写在jQuery导入之后)
<script src="js/http.js"></script>
(3)调用ajax方法(根据url参数的不同，会获得不同的接口对象)
http({
url:"name",
success:res=>{
console.log(res);
}
});
http({
url:"/classic/latest",
success(res){
console.log(res);
}
})
