使用 useQuery() (react-query) 作为自定义钩子是对还是错？

Question

我使用 useQuery() 从服务器接收数据。为了不重复API站点地址和一系列附加参数，我使用了如下自定义hook：

export function useGetApi(mode, params, key) {

  // get initial config from context:
  const { config } = useGetConfig();

  const url = `https://example.com/api/${ mode }/?${ params }&lang_code=${ config.language }`;
  const queryKey = `${key}_${config.language}`;


  // async function for get API:
  async function getApi() {
    const { data } = await axios.get(url);
    return data;
  }

  return useQuery(['getApi', queryKey], getApi, {
    enabled: !!config.language
  });
}

包括语言在内的一系列基本设置位于名为“Config”的上下文中。在我有的每个组件和每个需求中，我调用这个自定义钩子并填写参数，例如：

const { isLoading, data: products } = useGetApi(`products`, `company_id=${companyId}`, `products_${companyId}`);

这是错误的吗？

Answer 1

我个人认为你做的没有问题。 React 的美妙之处在于您可以自由构建组件和自动化文件以提高您的工作效率，这正是您所做的。

使用 useQuery() (react-query) 作为自定义钩子是对还是错？

Use useQuery() (react-query) as a custom hook right or wrong?

reactjs

react-query