問題描述

在async/await中，await接收的需要是一個promise對象，那么我這樣寫：

async getAddressList () {this.list = await AreaSvr.getList(320100); }getAddressList().catch((err) => { ... });

AddressSvr.getList = function (pid) { return new Promise((resolve, reject) => { Vue._http.get(’area/get’, {pId: pid}).then( res => {resolve(res.Data); }, err => {reject(err); }); })};

這樣是沒有問題的，AreaSvr.getList中返回的是一個promise對象。現在我把AreaSvr.getList封裝一下，加一個緩存：

let areaList = [];AddressSvr.getAreaList = (level, pid) => {// 接收等級跟pid兩個參數，如果已有areaList或者相關二級list，直接返回Promise.resolve（...） if (level === 1 && areaList.length !== 0) { return Promise.resolve(areaList) } else if (level === 2) { for (let i = 0; i < areaList.length; i++) { if (areaList[i].AreaId === pid && areaList[i].children.length !== 0) {return Promise.resolve(areaList[i].children) } } } // 這里對之前的http請求AddressSvr.getList進行封裝，在獲取到相關值之后，進行緩存并且返回 return new Promise(// 返回一個promise對象，讓await來接收 (resolve, reject) => { AddressSvr.getList(pid).then(res => { if (level === 1) { areaList = res;// 緩存areaList return resolve(areaList); //返回 } for (let i = 0; i < areaList.length; i++) { if (areaList[i].AreaId === pid) { areaList[i].children = res;// 緩存子列表 return resolve(areaList[i].children);// 返回 } }}, err => { reject(err);} ); } );};

async getAddressList () {this.list = await AreaSvr.getAreaList(1, 320100);//這里傳入等級，使用加了緩存的函數if (this.list.length !== 0) { this.childList = await AreaSvr.getAreaList(2, this.list[0].AreaId);} }

在這里，我在AddressSvr.getList的外面封裝了一層promise做了緩存，這時候await接收的是AddressSvr.getAddressList 這個函數返回的promise了，但是這個時候返回的promise無效，直接catch到error了，請問一下我哪邊寫的有問題？

問題解答

如果直接catch了，說明寫法沒有問題，可能是業務部分出錯了，可以把error信息貼出來看看

我在上面判斷是否有緩存的地方用的是areaList[i].children.length !== 0，這個時候還沒有children，是undefind，所以會報錯。這個不是async/await的用法問題，是我自己寫錯了。