Awaited<R> 未使用响应对象将其解包到 R

Question

我从通用函数中调用

axios.get

返回一个 AxiosResponse 对象。该物体具有以下形状：

interface AxiosResponse<T = any, D = any> {
  data: T;
  ...
}

get

调用具有以下类型：

get<T = any, R = AxiosResponse<T>, D = any>(url: string, config?: AxiosRequestConfig<D>): Promise<R>;

我花了几个小时来寻找解决此错误的答案：

"Property 'data' does not exist on type 'Awaited<R>

在此代码中（已标记错误位置）：

export const fetchWithRetry = async <
  T = any,
  Q = Record<string, string>,
  R = AxiosResponse<T>
>(
  route: string,
  queryParams: Partial<Q> = {},
) => {
  const response = await fetchResponseWithRetry<T, Q, R>(route, queryParams)
  return response.data; // <= ERROR IS HERE
};

export const fetchResponseWithRetry = async <
  T = any,
  Q = Record<string, string>,
  R = AxiosResponse<T>,
>(
  route: string,
  queryParams: Partial<Q> = {},
) => {
  try {
    const options: AxiosRequestConfig = {
      headers: {
        "Content-Type": "application/json",
      },
      params: <Q>{ ...queryParams },
    };
    return (await axios.get<T, R, unknown>(route, options));
  } catch (error) {
    if (error instanceof Error) {
      buildLogger(`${error.message}`);
      if (error instanceof AxiosError) buildLogger(`${error.request.url}`);
    }
  }
  throw new Error(`This should never be reached.`);
};

据我了解，

Awaited<R>

类型是在4.5中添加的。我从其他答案了解到，Awaited类型应该解包到R（来自该问题的已接受答案）：

如果您正在等待的类型

T

是

Promise<U>

，其中

U

不是任何类型的

Promise

，则

Awaited<T>

与

U

相同

我该如何解决这个问题？

Answer 1

这里的解决方案是进行类型断言。如果按如下方式重构函数，

export async function fetchWithRetry<
    T = any,
    Q = Record<string, string>,
    R = AxiosResponse<T>,
>(route: string, queryParams: Partial<Q> = {}) {
    const response = await fetchResponseWithRetry<T, Q, R>(route, queryParams);
    const data = response.data;
    return data;
}

export async function fetchResponseWithRetry<
    T = any,
    Q = Record<string, string>,
    R = AxiosResponse<T>,
>(route: string, queryParams: Partial<Q> = {}) {
    try {
        const options: AxiosRequestConfig = {
            headers: {
                "Content-Type": "application/json",
            },
            params: <Q>{ ...queryParams },
        };
        return (await axios.get<T, R, unknown>("/url", options)) as Promise<{
            data: R;
        }>;
    } catch (e) {
        if ((e as AxiosError).response?.status === 429) {
            throw e;
        }
        throw e;
    }
}

您可以调整此设置以满足您的需求，以便您可以根据需要访问 AxiosResponse 中的特定字段。