vue promise then多级嵌套

和上一篇类似的需求，

目前我有一个需求是： 通过getFormNames得到了一个大集合A，在循环遍历A集合的每一条数据A1，A2。。。。以此类推，拿到A1作为参数，又会获得一个新集合，最终是把返回的结果拼装改造下返回一个新的response


function getForms(){
getFormNames().then(formNames => {
console.log('查询form')
return getFormDetails(formNames)
}).then(returnObj => {
console.log('查询form 明细')
return getChildForms(returnObj)
}).then(returnObj => {
console.log('查询子form')
console.log(returnObj)
return returnObj
})
}

function getFormNames(){
return new Promise((resolve, reject) => {
  setTimeout(resolve(['form1','form2']),2000)
  })
}

function getFormDetails(formNames){
return new Promise((resolve, reject) => {
let returnObj = { formConfig: formNames}
const promises = []
formNames.forEach((formName,index) => {
let promise = new Promise((resolve, reject) => {
setTimeout(resolve({fields:{a:1,b:2,c:3}}),2000)
})
promises.push(promise)
})
Promise.all(promises).then(formDetails => {
  const forms = []
  formDetails.forEach((formDetail) => {
  forms.push(formDetail)
  })
  returnObj.forms = forms
  resolve(returnObj)
})
})
}

function getChildForms(returnObj){
return new Promise((resolve, reject) => {
const promises = []
returnObj.forms.forEach((form,index) => {
let promise = new Promise((resolve, reject) => {
setTimeout(resolve({childFields:{a:1,b:2,c:3}}),2000)
})
promises.push(promise)
})
Promise.all(promises).then(childForms => {
  childForms.forEach((childForm,index) => {
  returnObj.forms[index].childFields = childForm
  })
  resolve(returnObj)
  })
  })
}

getForms();



这种写法结构比较清晰些  可以拷贝出去直接用作js运行
也可以直接下载附件