async ... await

promise写法ajax

function runAsync1(){
            var p = new Promise(function(resolve, reject){
                //作一些异步操做
                setTimeout(function(){
                    console.log('异步任务1执行完成');
                    resolve('随便什么数据1');
                }, 1000);
            });
            return p;
        }
        function runAsync2(){
            var p = new Promise(function(resolve, reject){
                //作一些异步操做
                setTimeout(function(){
                    console.log('异步任务2执行完成');
                    resolve('随便什么数据2');
                }, 2000);
            });
            return p;
        }
        function runAsync3(){
            var p = new Promise(function(resolve, reject){
                //作一些异步操做
                setTimeout(function(){
                    console.log('异步任务3执行完成');
                    resolve('随便什么数据3');
                }, 2000);
            });
            return p;
        }

        runAsync1()
                .then(function(data){
                    console.log(data);
                    return runAsync2();
                })
                .then(function(data){
                    console.log(data);
                    return runAsync3();
                })
                .then(function(data){
                    console.log(data);
                });

1. 包装多个promise对象 api

2. 多个异步操做 要在回调里 return下一个promise对象  ,操做多了,回调也是有点麻烦 promise

==============异步

async 写法async

用同步的方式 写异步操做this

获取部门数据时,必须是return 异步对象url

若是return res = this.$ajax...     这样会有问题 取值 undefinedcode

getDeptData(){ //获取部门数据
				return this.$ajax({
					url: this.$ajax.apiUrl("/sys/dept/list"),
					method: "get",
					params: this.$ajax.adornParams()
				});
			},

			getRolesData(){ //获取角色数据
				return  this.$ajax({
					url: this.$ajax.apiUrl("/sys/role/all"),
					method: "get",
					params: this.$ajax.adornParams()
				});

			},

			async init(id){
				try{
					let res_dept = await this.getDeptData();
					let res_role = await this.getRolesData();

					this.deptList = this.$tool.treeDataTranslate(res_dept.data);
					this.roleList = res_role.data;
					this.dataForm.id = id;
					this.isEdit=false,

					this.visible = true;
					this.$nextTick(() => {
						this.$refs["dataForm"].resetFields();
					});


					if (!id) {// 新增
						this.dataForm.deptName = null;
						console.log('新增', this.dataForm)
					} else {// 修改
						this.isEdit = true;

						this.$ajax({
							url: this.$ajax.apiUrl(`/sys/user/detail`),
							method: "get",
							params: this.$ajax.adornParams({
								id: this.dataForm.id
							})
						}).then(({data}) => {
							console.log('详情', data);
							this.dataForm.deptId = data.deptId;
							this.dataForm.loginName = data.loginName;
							this.dataForm.phoneNumber = data.phoneNumber;
							this.dataForm.remark = data.remark;
							this.dataForm.roleId = data.roleId;
							this.dataForm.status = data.status;
							this.dataForm.userName = data.userName;

							this.dataForm.id = id;
							this.deptListTreeSetCurrentNode();

						});
					}
				} catch(err){
					console.log(err)
				}
			},
相关文章
相关标签/搜索