0
点赞
收藏
分享

微信扫一扫

promise

祈澈菇凉 2022-03-14 阅读 74
Promise 三种状态
  • pending(等待)
  • fulfiled(成功)
  • rejected(失败)
Promise的理解
  • 是一个构造函数
  • 处理异步回调
  • 多个异步函数同步处理
  • 封装同意入口或错误处理
  • console.dir(Promise) 在原型上有.then .catch等方法,在原型链上有all resolve reject 等常用方法。
  • Promise有两种状态改变的方式,而且状态只能从pending改变为resolved或者rejected,并且不可逆。当状态变成resolved时会触发.then()方法,当状态改变成rejected时会触发抛出错误方法.catch()
Promise的使用方法
  1. Promise 处理异步回调
function getUserInfo(){
	return new Promise((resolve,reject)=>{
		http('localhost:8081/api/userInfo').then(res=>{
			resolve(res)
		}).catch(err=>{
			reject(err)
		})
	})
}

getUserInfo().then(res=>{
	console.log(res)
}).catch(err=>{
	console.error(err)
})

  1. 多个异步函数同步处理
function getList(url){
	return http(url) //调用接口不做处理
}

const api = ['/article','/article/1','article/2']

let allHttp = api.map(api=>{
	return getList(api)
})

Promise.all(allHttp).then(res=>{
	res.forEach((item,index)=>{
		console.log('第'+index+'次请求成功返回的结果',item)
	})
}).catch(err=>{
	err.forEach((item,index)=>{
		console.log('第'+index+'此请求失败返回的结果',item)
	})
})
  1. 封装统一方法或错误处理
function errorHandler(PromiseFun,callback){
	return PromiseFun.then(res=>{
		callback(res)
	}).catch(err=>{
		this.$confirm.error(err.msg|'请求出错')
	}
}
举报

相关推荐

0 条评论