react 結合 Promise 和 async await 解決多個異步請求 后統一設置狀態問題

現在需要解決以下問題：

我們有兩個和多個前后端交互請求，我們需要在這兩個請求都完成之后去讓runder渲染，實現思路如下：

1、定義一個loading的state，給定初始值為true，在runder函數中，如果loading為true則直接返回

this.state = {
    loading: true
}

2、將兩個或多個請求使用Promist.all([]),做並發處理。

3、然后使用async  await 等待請求處理完成后將loading置為false。

 

實現代碼如下：

getAsyncData() {
    return Promise.all([
        this.getCurriculumVitae(),
        this.growthPathDate()
    ])
}
async asyncFun() {
    await this.getAsyncData()
    this.setState({loading: false})
}

getCurriculumVitae() {
    return request.get('xxxx',{//這里必須使用return返回異步請求
    params: {
        //
    }
    }).then((resp:any) => {
        if(resp && resp.code == "200" && resp.data){
            this.setState({
                //
            })
        }
    })
}

growthPathDate = () => {
    return request.get('xxxx',{//這里必須使用return返回異步請求
        params: {
            //
        }
    })
    .then((resp:any) => {
        if(resp && resp.code == '200' && resp.data) {
            this.setState({
                //
            })
        }
    })
}