0

react-query用来调用 API。该调用运行良好,每次在输入字段中更新查询值时都会执行该调用。
不幸的是,即使查询为空,它也会触发 API 调用。

例如,当用户加载应用程序时,输入(以及查询)将为空白。

如何仅在有查询时触发 API 调用?

代码

// API call
export async function myQuery(query) {
  try {
    const res = await ax.get("myapiurl", {
      params: { query },
    });
    return res.data;
  } catch {
    return null;
  }
}

// react-query
const { status, data } = useQuery(
  ["myquery", { query }],
  () => myQuery(query)
);
4

2 回答 2

1

你可以用一个简单的 if 语句来实现:

// apicall
export async function myQuery(query) {
  try {
    const res = await ax.get("myapiurl", {
      params: { query },
    });
    return res.data;
  } catch {
    return null;
  }
}

// react-query
  const { status, data } = useQuery(
    ["myquery", { query }],
    () => {
      if (query) {
        return myQuery(query)
      }
  );
于 2020-06-03T15:17:46.097 回答
0

这个确切的用例有一个enabled标志。react-query

使用示例

const { status, data } = useQuery(
  ["myquery", { query }],
  () => myQuery(query).
  { enabled: !!query }
);

文档供参考

于 2021-08-18T16:16:51.310 回答