<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<!--
异步函数是基于 promise之上的一种新的异步结果方案
把异步的写法变成同步的写法
异步请求(接口, 成功回调, 失败回调)
异步请求(接口).then(成功函数).catch(失败函数)
async function getData () {
try {
const 结果1 = await 异步请求(接口)
const 结果2 = await 异步请求(接口)
对结果进行处理
} catch (err) {
// 对错误信息的处理
}
}
getData()
dispatch 获取action里的结果
在action里函数里返回一个Promise对象
在dispatch里可以用.then进行下一步的操作
action () {
return new Promise((resolve, reject) => {
axios.get('接口').then(res => {
// 对res进行处理
resolve()
}).catch(() => {
reject()
})
})
}
this.$store.dispatch('action').then(() => {
}).catch(() => {
})
-->
</body>
<script src="../js/vue.js"></script>
<script>
function get (url) {
return new Promise((resolve, reject) => {
const xhr = new XMLHttpRequest();
xhr.open('get', 'url', true);
xhr.send();
xhr.onreadystatechange = function () {
if (xhr.readyState === 4 && xhr.status ===200 ) {
// callback && callback(JSON.parse(xhr.responseText))
// 上面的这种写法相当于
// if (callback) {
// cakllback()
// }
resolve(JSON.parse(xhr.responseText));//相当于回调函数 .then里面的函数
} else if (xhr.readyState === 4 && (xhr.status > 300 || xhr.status < 200) ) {
reject();
}
}
})
}
//异步的请求 同步的写法
async function getData () {
try { //对错误进行捕获
const res1 = await get('http://localhost/demo.php?demo1');
const res2 = await get('http://localhost/demo.php?demo2');
} catch (err) {
console.log(err)
}
}
getData()
//promise对象
// const p = new Promise((resolve, reject) => {
// resolve();
// });
// console.log(p);
</script>
</html>
