Promise在vue项目中快速灵活的应用
简介
promise和ajax功能类似,都是用来做异步请求的。promise的优势在于可以链式编程,在response还没回应时,then操作中可以把正常流程代码实现,catch捕获异常(而且可以放在最后进行统一捕获),可以不断then 下去; 前后端分离大背景下,ajax是基于原生的xhr,已经不能很好的适应mvvm这种前端模型了。
如何申明
本章主要是用来描述vue项目开发前端页面的,为何先介绍promise呢?因为vue核心组件始终是围绕着Promise展开的;如vuex.store的 actions 中方法 都是用Promise来实现的;后端api交互用的axios,也是promise封装的。
先简单申明一个Promise对象;
new Promise( function (resolve, reject) {
// 一段耗时的异步操作
resolve(data) // 数据处理完成
// reject('失败') // 数据处理出错
} )
网上有说构造Promise时 就一个参数,有的说两个参数,都没错; 如果说一个参数,这个参数就是一个函数,如果说两个参数,指的是这个函数有两个参数。
状态变化
promise状态说明,从初始化时pending——》到resolved或rejected(只能是二者中某一种状态),在未调用resolve或reject方法时,promise都是pending状态,一旦调用了resolve或reject方法 promise就结束了,promise状态为resolved或rejected;其构造函数中不能进行其他操作了,只能进行后续的then或catch操作了(then 、catch也是promise类型对象)。
所以Promise 生命流程 只有两种状态 ;
正常的: pending状态(未调用resolve方法前)---->resolved状态;
或者失败的 : pending状态(未调用rejecte方法前)-------> rejected状态
链式处理
re