问题标签 [react-query]

我有三种不同的数据类型：Books、Authors和Publishers。我使用 react-query 来获取每种类型的列表，即useBooks(bookIds), useAuthors(authorIds)，usePublishers(publisherIds)当我尝试相互独立地使用它们时，这非常有用。

但是，一本书有一个 and 的列表，authorIds我publisherIds想将PublishersandAuthors对象加入到Books. 我想不出使用 react-query 的正确方法。理想情况下，我希望能够调用所有三个钩子，等待它们的响应，然后将其作为一个大钩子返回。但是，我不能绕着头来做这件事。

我尝试的一种实现是使每个连接数据的钩子都Book依赖于前一个钩子的结果。这行得通；然而，最大的问题是连接是彼此异步完成的；组件使用的数据不能期望 aBook有 aAuthor或Publisher一旦返回数据。这是一个例子：

有什么方法可以编写上述逻辑，使得在所有数据都加入之前什么都不返回？在我的脑海中，我这样做的方式是在另一个 react-query 钩子的查询函数中调用所有三个钩子，但钩子规则不允许我这样做。

我有一些资源，我们称之为todos。

我有它的列表，用户可以从列表中删除。

在我实施看起来像的 paginaiton 之前

在我删除它的其他地方

所以在其他地方我只是修改这个数据集叫做'todos'

但是在我实现了 paginaiton 之后，事情变得更加复杂了，因为 QueryKey 现在不仅仅是'todos'，而是['todos', page]

因此，当我删除待办事项并调用onSuccess此代码queryCache.getQueryData<any>('todos');时，它会返回我undefined- 因为 QueryKey 还包含此页码。

我应该如何解决？使用分页的 QueryKey 修改查询数据。

当 useQuery 有参数时，有人会建议我用 useMutation 更新数据的正确方法是什么？

假设我们有以下代码：

所以该方法从数据库中methodWhichTakesThoseIds获取["id1", "id2"]并返回一些数据。此数据是对象类型的数组，例如SomeModel[]. 例如。它可能是：

[{name: "foo"}, {name:"bar"}]

一切都好，但现在我想在屏幕和数据库上更新这些数据useMutation

所以现在我向数据库添加了新项目，以防万一的数据应该是：[{name: "foo"}, {name:"bar"}, {name:"newOne"].

一切都很好，但是当我更改路线并再次返回时，只有 2 个 ID 的 useQuery 将再次触发，并且 useQuery 从数据库中返回只有两个元素的数据，因为它只有两个 ID 作为参数["id1", "id2"]。

如果我设置queryCache.setQueryData(["key", ["id1", "id2", data.id]], (old) => [...old, data]，我仍然使用只有两个 ID 的原始 useQuery，因此更改不会反映在屏幕上。

我想有一些解决方案，比如每次更新后都从服务器重新获取数据，但主要问题是“

当 useQuery 有参数时更新数据的最佳方法是什么 - 不仅仅是键之类的useQuery("key", method)？

试图找到有关反应查询的答案。

useQuery 和 useMutation 有什么区别？

据我了解，useQuery 是依赖调用。

useMutation 用于需要更新当前状态的帖子（缓存失效等）

这是正确的假设吗？

这与这个问题有关： 在反应查询中处理未经授权的请求

我理解 React-Query 不关心响应代码的观点，因为没有错误。因此，例如，如果服务器以 400“错误请求”响应，我是否必须检查 muate 函数返回的数据？

我需要将用户保存在缓存中。

谢谢。

在我的根组件上，我使用了使用查询来获取用户详细信息。但问题是在我注册或登录之前，它重新访问了太多次。结果我什至无法顺利填写注册/登录表格。

有什么办法，只有在回调函数没有返回错误的情况下才会重新获取？

这就是我尝试过的

所以我在下面有这个产品组件

1. 显示组件列表
2. 有一个按钮，可以打开一个模式来添加组件
3. 每行都有一个编辑按钮，用于打开模式并更新该组件。

我正在为我的 api 调用使用 react-query，虽然我目前所拥有的东西正在工作，但感觉很糟糕，希望你们能提出更好的方法来把它放在一起。

所以这是我的组件：

这是我要导入的反应查询钩子：

您会注意到开头的重要部分：

这里的重点是在 state 中有一个产品 id，当我单击表中的一行来编辑记录时，它会设置产品 id 并从 api 获取数据。这适用于注释掉的代码，但不使用 react-query。想要反应查询的力量，我努力重构它以使用我上面的内容。它确实有效。但感觉不对。

我遇到的最大问题是当我第一次设置它时，我的 useQuery 总是会使用未定义的 productId 调用初始渲染并失败。您可能已经注意到，我尝试将其添加enabled: false到我的 useQuery 中，因此我可以手动调用它，但由于某种原因它无法正常工作。也许你们还有其他想法。

不管怎样，珍惜时间。

我正在开发一个 React JS 项目。我正在使用 React Hooks（功能组件）和React query。

我通常在功能组件中按如下方式运行/执行查询。

基本上，在加载组件时执行查询，以便也进行 API 调用。

现在，我正在寻找一种只能在单击按钮时执行查询的方法。

正如您在上面的虚拟代码中看到的那样，注释解释了我想要实现的目标。我怎样才能做到这一点？

我正在做一个 React JS 项目。在我的项目中，我使用 React 查询https://react-query.tanstack.com/docs/guides/mutations。我正在使用突变向服务器发出发布请求。但是当API调用失败并返回onError回调时，我正在尝试从服务器返回响应。

这是我的代码。

正如您在评论中看到的，我试图在 onError 回调中读取从服务器返回的字段。我怎样才能做到这一点？

我有一个选择选项菜单。因此，当用户选择一个选项时，我想使用该选项向服务器发送一个 GET/ 请求，并从服务器接收过滤后的数据。

这可以使用 useEffect(() => {// send the request}, [criteria]) 来实现

因为，useEffect 确保只有在 setCriteria 完成后，请求才会发送到服务器。

但是，我正在使用react-query图书馆。因此，它不允许在useQueryinside中使用useEffect。

结果，请求在 setState 完成之前被发送到服务器。因此，服务器获取先前选择的值，而不是当前选择的值。

改变：

获取帖子：