代码之家 › 专栏 › 技术社区 › Jim

将AxioPromise更改为常规Promise的正确方法,同时避免Promise构造函数反模式

promise typescript javascript

0

Jim · 技术社区 · 7 年前

给定以下typescript函数:

public load(filter: IFilter): Promise<Material[]> {
    return axios.get<Material[]>("data.json");
}

[ts]
Type 'AxiosPromise<MaterialSpectrum[]>' is not assignable to type 'Promise<MaterialSpectrum[]>'.
  Types of property 'then' are incompatible.
    Type '<TResult1 = AxiosResponse<MaterialSpectrum[]>, TResult2 = never>(onfulfilled?: (value: AxiosResponse<MaterialSpectrum[]>) => TResult1 | PromiseLike<TResult1>, onrejected?: (reason: any) => TResult2 | PromiseLike<TResult2>) => Promise<...>' is not assignable to type '<TResult1 = MaterialSpectrum[], TResult2 = never>(onfulfilled?: (value: MaterialSpectrum[]) => TResult1 | PromiseLike<TResult1>, onrejected?: (reason: any) => TResult2 | PromiseLike<TResult2>) => Promise<...>'.
      Types of parameters 'onfulfilled' and 'onfulfilled' are incompatible.
        Types of parameters 'value' and 'value' are incompatible.
          Type 'AxiosResponse<MaterialSpectrum[]>' is not assignable to type 'MaterialSpectrum[]'.
            Property 'length' is missing in type 'AxiosResponse<MaterialSpectrum[]>'.

为了避免仅仅返回或铸造 AxiosPromise
从纸面上看,这是正确的。

    return new Promise((resolve, reject) =>
        axios.get<Material[]>("data.json")
            .then((data) => resolve(data.data))
            .catch((data) => reject(data.data)));

但这显然违反了法律 Promise constructor anti pattern .

1 回复 | 直到 7 年前

1

2

Jim 7 年前

你可以“包装”axios的承诺。上车 Promise.resolve ,就像这样

return Promise.resolve(axios.get<Material[]>("data.json"))
.then(({data}) => data)
.catch(({data}) => { throw data; });