美文网首页
VUE前后端交互之promise的用法

VUE前后端交互之promise的用法

作者: 小黄不头秃 | 来源:发表于2023-06-07 01:27 被阅读0次
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Document</title>
    </head>
    <body>
        <!-- 
            promise用法:
            异步调用:
                (1)定时任务
                (2)Ajax
                (3)事件函数
            多次异步调用的依赖分析
                多次异步调用的结果顺序不确定
                异步调用结果如果存在依赖需要嵌套
         -->
    
         <!-- 
             promise是异步编程的一种解决方式,从语法上来讲,promise是一个对象,从他可以获取异步操作的消息
    
             使用promise主要有以下好处:
             (1)可以避免多层异步调用的嵌套问题(回调地狱)
             (2)promise对象提供了简洁的api,使得控制异步操作更加容易
          -->
    
          <!-- 
              promise基本使用
              实例化promise对象,构造函数传递函数,该函数中用于处理异步任务
              resolve和reject两个参数用于处理成功和失败的两种情况,并且通过p.then获取处理的结果
                var p = new Promise(function(resolve,reject){
                    //  成功时调用resolve()
                    // 失败时调用reject()
                });
                p.then(function(ret){},function(ret){});
           -->
         <div>前后端交互</div>
         <script src="./vue/vue.js"></script>
         <script>
            //  $.ajax({
            //      url:"",
            //      success:function(data){
            //          console.log();
            //      }
            //  }
            //  );
             var p = new Promise(function(resolve,reject){
                //  实现异步任务
                setTimeout(function(){
                    var flag =false;
                    if(flag){
                        //正常情况
                        resolve('hello');
                    }else{
                        reject('出错了');
                    }
                },100);
             });
             p.then(function(data){
                 console.log(data);
             },function(info){
                console.log(info);
    
             });
         </script>
    </body>
    </html>
    

    相关文章

      网友评论

          本文标题:VUE前后端交互之promise的用法

          本文链接:https://www.haomeiwen.com/subject/bqlpedtx.html