javascript - 如何向 TypeScript 正确添加带参数的回调类型？

Question

我有这个方法:

export default class ApiService {
  static makeApiCall = (
    url: string,
    normalizeCallback: (d: ResponseData) => ResponseData | null,
    callback: (d: any) => any
  ): Promise<void> => (
    ApiClient.get(url)
      .then(res => {
        callback(normalizeCallback(res.data));
      })
      .catch(error => {
        console.error(`ApiClient ${url}`, error);
      })
  )

  static getArticles = (callback: (a: Article[]) => void): Promise<void> => (
    ApiService.makeApiCall(
      'articles',
      ApiNormalizer.normalizeArticles,
      callback
    )
  )
}

在这一行回调:(d:any)=>any typescript 大喊

warning Unexpected any. Specify a different type

为了向您展示更多上下文，我在此处调用方法 getArticles

export const fetchArticles = (): ThunkAction<Promise<void>,{},{},AnyAction> => {
  return async (dispatch: ThunkDispatch<{}, {}, AnyAction>): Promise<void> => {
    dispatch(() => ({ type: FETCH_ARTICLES }));
             // HERE: getArticles
    return ApiService.getArticles(articles => dispatch(loadArticles(articles)));
  };
};

那么我怎样才能正确输入回调函数呢？

Answer 1

我会把它写成:

function makeApi<T>(url: string, normalizeCallback: (d: ResponseData) => T | null) {
  return function(callback: (data: T | null) => any) {
    return ApiClient.get(url)
      .then(res => {
        callback(normalizeCallback(res.data));
      })
      .catch(error => {
        console.error(`ApiClient ${url}`, error);
      });
  };
}

// in the class
static getArticles = makeApi<Article[]>("articles", ApiNormalizer.normalizeArticles)

这样，你...

1) 正确输入通用数据类型。

2)消除大量样板文件。

3) 将 makeApi 封装到模块中，我认为它不应该通过类公开。