fetch-promise

Posted noraZhang

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了fetch-promise相关的知识,希望对你有一定的参考价值。

一. promise 对象

  promise是ECMAscript 6 提供的构造函数, new Promise() 创建的对象代表了将来要发生的事件,它有如下特点:

    1)状态一旦发生变化,就不受外界影响; 任何时候给Promise 对象添加回调函数,它都保持在这个状态

      其状态变化有以下两种形式:

        pending(初始状态)  --> fulfilled(操作成功)

        pending --> rejected(操作失败)

    2)实例化的 promise 对象可以调用 .then() 和 .catch()方法接收 onFUlfilled 和 onRejected 状态的返回值

  阮一峰大神的理解:

    *有了Promise对象,就可以将异步操作以同步操作的流程表达出来,避免了层层嵌套的回调函数。此外,Promise对象提供统一的接           口,使得控制异步操作更加容易。

 

二.  fetch 发get 和 post 请求,返回的是一个promise对象

//1.发送get请求, 参数在url中拼接
var num = 1;
fetch("/user/queryUser?page="+num+"&pageSize=5").then(res

   =>res.json()).then(data =>{
        console.log(data);
        $(‘#userBox‘).html(template(‘userTpl‘, {data: data}))

   }).catch(err =>{
          console.log(err);
})
//2.发送post 请求, 参数在 body中传递, 而且必须转换为字符串

fetch(‘url‘, {
            method: ‘post‘,
            //body: JSON.stringify(data),
            body: JSON.stringify({
                name: ‘nora‘,
                age: 18
            }),
            headers : {
                ‘Content-Type‘ : ‘application/json‘
            }
        }).then(res => res.json()).then(data =>{
            //console.log(data);
                if(data.success) {
                location.reload()
            }
        }).catch(err =>{
            alert(err);
        })

    

 



以上是关于fetch-promise的主要内容,如果未能解决你的问题,请参考以下文章

VSCode自定义代码片段——CSS选择器

谷歌浏览器调试jsp 引入代码片段,如何调试代码片段中的js

片段和活动之间的核心区别是啥?哪些代码可以写成片段?

VSCode自定义代码片段——.vue文件的模板

VSCode自定义代码片段6——CSS选择器

VSCode自定义代码片段——声明函数