接口调用 async/await

• async/awit 处理异步操作

1. 基本用法

• async/awit 是ES7 引入的新语法，可以更加方便的进行异步操作
• async 作为一个关键字放到函数前面
  • 任何一个 async 函数都会隐式返回一个 promise
• await 关键字只能在使用 async 定义的函数中使用
  • await后面可以直接跟一个 Promise实例对象
  • await函数不能单独使用

<script>
    /* 
        async/await 处理异步操作
    */

    // 配置请求的基准URL地址
    axios.defaults.baseURL = 'http://localhost:3000/'

    /* axios.get('data').then((ret)=>{
        console.log(ret.data);
    }) */

    // async/await
    // await 后面跟promise 实例对象 Promise实例中处理异步任务
    // ret 得到异步结果
    /* async function queryData(){ // 异步任务
        var ret = await axios.get('adata');
        // console.log(ret);
        // console.log(ret.data);
        return ret.data;
    } */
    // queryData();

    // 异步任务 Promise实例中处理异步任务
    async function queryData(){ 
        var ret = await new Promise((resolve, reject)=>{
            resolve('你好');
        }, 100);
        return ret;
    }
    queryData().then((data)=>{
        console.log(data);
    })
</script>

2. async/await 处理多个异步请求

• 多个异步请求的场景

<script>
    async function quertData(id){
        const info = await axios.get('asyncl');
        const ret = await axios.get(`asyncl2?info=`+info.data);
        return ret;
    }
    queryData.then(ret=>{
        console.log;
    })
</script>

<script>
    /* 
        async/await 处理多个异步任务
    */

    // axios.defaults.// 配置请求的基准URL地址
    axios.defaults.baseURL = 'http://localhost:3000/';

    async function queryData(){
        var info = await axios.get('async1');
        var ret = await axios.get('async2?info=' + info.data);
        return ret;
    }

    queryData().then((data)=>{
        console.log(data);
        console.log(data.data)
    })
</script>