Question

这是我的代码：

<td>{{$post->categories->name}}</td>

我有此错误：

反应挂钩useEffect缺少依赖项：'dfEventQuery'。要么包括它或删除依赖项数组

但是当我将其添加到数组上时：[shopWelcomeSent，历史记录，dfEventQuery]我收到此错误：

'dfEventQuery'函数使useEffect Hook依赖（在第201行）在每个渲染上更改。要解决此问题，请包装将'dfEventQuery'定义放入自己的useCallback（）挂钩

我已经坚持了好几个小时，只是无法包裹我的头，为什么这不起作用？

Answer 1

因此，在这种情况下，将函数包装到useCallback中并列出所有依赖项会更容易：

const dfEventQuery = useCallback(async (event: string) => {
  const {
    data: { result }
  } = await axios.post("/api/df_event_query", { event, userId });
  for (let msg of result.fulfillmentMessages) {
    const botSay: MessageDataType = { speaks: "bot", msg };
    setMessages(oldMessages => [...oldMessages, botSay]);
  }
}, [userId]);

并将其列出到useEffect的依赖项中。

但是，老实说，我希望Eslint不会抱怨缺少依赖项，因为在您的代码中它将在相关的渲染周期中重新创建，并且无论如何都不会发生“过时的关闭”问题。

[UPD]在线程https://github.com/facebook/react/issues/14920#issuecomment-467212561中发现了类似的情况，但无论是预期的（以及原因）还是在useEffect的部门范围内拥有该功能的合法性，都看不到任何注释。

在useEffect上使用方法有困难，缺少依赖项和useCallback错误？

1 个答案: