Ajax 嵌套 Ajax(即: Ajax2 要通过 Ajax1 的返回值才能请求)
1. 原始写法
$.ajax({
url: 'xxx',
dataType: 'json',
success(res) {
$.ajax({
url: 'xxx' + res,
dataType: 'json',
success(data) {
console.log(data);
}
})
}
});
2. Promise 写法
let jqAjax1 = () => {
return new Promise((resolve, reject) => {
$.ajax({
url: 'xxx1',
dataType: 'json',
success: res => resolve(res),
error: res => reject(res)
});
})
};
let jqAjax2 = (data) => {
return new Promise((resolve, reject) => {
$.ajax({
url: 'xxx2' + data,
dataType: 'json',
success: res => resolve(res),
error: res => reject(res)
});
})
};
jqAjax1().then((data) => {
return jqAjax2(data);
}).then((data2) => {
console.log(data2);
});
3. Promise + async + await 写法
let jqAjax1 = () => {
return new Promise((resolve, reject) => {
$.ajax({
url: 'xxx1',
dataType: 'json',
success: res => resolve(res),
error: res => reject(res)
});
})
};
let jqAjax2 = (data) => {
return new Promise((resolve, reject) => {
$.ajax({
url: 'xxx2' + data,
dataType: 'json',
success: res => resolve(res),
error: res => reject(res)
});
})
};
async function simplifyPromise() {
let data = await jqAjax1();
let data2 = await jqAjax2(data);
}
4. Ajax 嵌套封装 Promise 写法
let ajax = (url, data = {}) => {
return new Promise((resolve, reject) => {
$.ajax({
url,
dataType: 'json',
data,
success: res => resolve(res),
error: errorMsg => resolve(errorMsg)
})
})
};
async function ajaxData() {
let data = await ajax('xxx');
let data2Url = `xxx${data}`;
let data2 = await ajax(data2Url);
console.log(data2);
}