问题标签 [use-effect]

我需要从远程数据中设置材料表列的查找。我试过了，但它不起作用：

远程调用有效，但不设置查找。你知道是否可以做到吗？

我正在使用Create-React-App和（优秀的）use-http来定制 useFetch 钩子。目标是在登录到帐户区域时进行几次 API 调用：

我曾尝试使用[]作为依赖数组，但我收到一个 linting 错误，说要移动initializeAccount到依赖数组。如果我添加它，该功能将无休止地运行。

设置依赖数组以便调用该函数一次的正确方法是什么？此外，在这种情况下，处理每个 API 调用中止的正确方法是什么？

我正在使用 React 和 Redux 开发一个应用程序。我正在尝试使用 API 数据预填充我的输入。为此，我在 useEffect 中获取我的 API 数据。而且我也在里面设置我的状态。问题是输入没有填充 API 数据。它是空的，但是当我重新加载页面时，它会被填充并且工作正常。

这是我的代码：

编辑问题.js

question.js（动作）

注意：如果我将question对象传递给 useEffect 挂钩依赖数组（正如 ESlint 告诉我的那样），输入会被填充，但GET_QUESTION会在无限循环中调度。正如我在 chrome 的 ReduxDevToolsExtension选项卡中看到的

有什么想法可以解决这个问题吗？

截至目前运行我的代码将在每次打开应用程序时显示模态，我认为它与“modalVisibility”的初始状态有关

“const [modalVisibility, setModalVisibility] = useState(true);” 每次启动应用程序时都会被调用？如果是这样的话，那就是问题所在。

这是“onShow”模式属性的问题吗？

我正在使用'react-burger-menu' https://github.com/negomi/react-burger-menu 在useContext钩子的帮助下，我想要另一个按钮来关闭/打开我已经实现的侧边菜单。我的问题是我在他们的文档之后收到以下错误

对象作为 React 子对象无效（找到：带有键 {isMenuOpen、toggleMenu、stateChangeHandler} 的对象）。如果您打算渲染一组子项，请改用数组。

Cart.js（这是实现“汉堡菜单”的地方）

MyContext.js这是代码中断的地方。我已经尝试删除一些代码并只是发送字符串值以确保它有效并且确实有效，但是一旦我开始使用它拒绝编译的函数。

Navigation.js这就是我包装提供程序的方式。这应该没问题。

我一直在关注“burger-menu”的官方文档，了解如何在这里使用钩子实现这一点，但我似乎无法弄清楚这个问题。任何建议将不胜感激。

我已经构建了一个useFetch与之紧密建模的函数：https ://www.robinwieruch.de/react-hooks-fetch-data这是它的简化版本：如何正确调用 useFetch 函数？

请注意，一旦启动获取，isLoading设置为 true。

我有一个用例，其中只有管理员用户才需要发出 fetch 调用。这是我添加到我的 React 组件中的代码：

第一条if语句的想法是仅在满足以下所有条件时才进行 fetch 调用： 1. 当前登录的用户是管理员。2.companiesFetch之前没有被调用过。3.newUsers.companies尚未填充。

这似乎是合乎逻辑的，但是如果我运行此代码，companiesFetch它会在应用程序崩溃之前被调用 25 次。我认为问题是时间问题，即companies.isLoading设置得不够快。

你会如何解决这个问题？

这是useFetch我构建的代码，它非常基于有关该主题的几篇知名文章：

除了一个用例之外，这似乎工作正常：

想象一下，输入了一个新的客户名称或用户名或电子邮件地址 - 必须检查一些数据以查看它是否已经存在以确保这些内容保持唯一性。

因此，例如，假设用户输入“我的现有公司”作为公司名称，并且该公司已经存在。他们输入数据并按下Submit。此按钮的 Click 事件将被连接，以便调用对 API 端点的异步请求 - 如下所示：companyFetch('acct_mgmt/companies/name/My%20Existing%20Company')

然后组件中将有一个useEffect构造，它将等待响应从端点返回。这样的代码可能如下所示：

在上面的代码中，如果公司名称存在，则会显示错误。如果它尚不存在，则该组件所在的向导将前进。这里的关键点是处理响应的所有逻辑都包含在useEffect.

这一切都很好，除非用户连续两次输入相同的公司名称。在这种特殊情况下，实例中的url依赖关系不会改变，因此没有新请求发送到 API 端点。companyFetchuseFetch

我可以想出几种方法来尝试解决这个问题，但它们看起来都像是 hack。我在想其他人以前一定遇到过这个问题，很好奇他们是如何解决的。

我有一个从数据库中获取的对象列表（在我的例子中是“相册”）。我需要编辑这些对象。在 useEffect 挂钩的编辑组件中，我启动了使用其 ID 获取所需专辑的操作。这个动作有效。然而，在同一个 useEffect 中，我试图在触发动作 redux 状态之前获取更改的 by。现在我面临一个问题 - 我所获取的只是 previos 状态。如何在当前 redux 状态的 useEffect 获取中实现？

我在这里看到了类似的问题，但是没有一个答案对我的用例有帮助。

我正在使用 redux-thunk。

编辑组件。问题出现在 setFormData - 它从减速器获取先前的状态，而不是当前状态。它似乎在状态被 getAlbumById 改变之前触发：

行动：

减速器

将不胜感激任何帮助/想法

我已经阅读了几个类似的问题并尝试了每个问题的解决方案，但似乎没有一个有效，并且与我使用 react-router 时的用例不完全匹配。

在我的 App.js 中，我将 refreshTokenId 的值设置为某个 UUID。我在 App.js 中有一个子组件，它在初始渲染时发送一个 API 调用来获取一些数据。现在，我已将 refreshTokenId 添加为我的 useEffect 挂钩的依赖项，其中包含 API 调用。我正在使用 react-router，当我从页面导航然后返回时，尽管依赖关系（即 refreshTokenId）没有改变，但 API 调用再次被触发。我通过在我的 Redux 开发工具中穿越时间并观察状态来确认这一点。第一次也是唯一一次 refreshTokenId 更改是在我的 App.js 安装时。这是因为我最初在 App.js 的一个 useEffect 中设置了 refreshTokenId 的值。

我不明白为什么当依赖项没有改变时我的子组件中的 useEffect 会触发。我在下面放了一些代码来演示这个问题：

我正在学习 React 并尝试编写一个异步钩子。使用setResultinside ofuseEffect似乎不起作用。当我尝试渲染结果时，什么都没有，所以我添加了一些控制台日志来查看发生了什么。useState 钩子中的 setter 函数似乎没有做任何事情。我一直在关注这个视频以获得一些指导，我的代码并没有太大的不同。

我有以下组件：

从console.log ({ json })，我看到服务器的响应看起来不错。

上面的控制台输出看起来也不错。

为什么是result空的？

编辑：谢谢帕特里克和塔尔加特。我现在知道了。所以，当我console.log在 useEffect 之外时，我可以看到result设置正确。{item}然后我意识到我在渲染中缺少对的引用：

现在我看到了页面上呈现的 ID。谢谢你的帮助。