Reactjs 使用React挂钩更正useEffect的依赖项数组

我正在使用和（优秀的）定制useFetch挂钩。目标是在登录到帐户区域时进行几个API调用：

const [user, setUser] = useState(null)
const [profile, setProfile] = useState(null)
const [posts, setPosts] = useState(null)

const request = useFetch('/')

const initializeAccount = async () => {
  try {
    const user = await request.get('api/user/')
    const profile = await request.get('api/profile/')
    const posts = await request.get('api/posts/')
    if (user) {
      setUser(user.data)
    }
    if (profile) {
      setProfile(profile.data)
    }
    if (posts) {
      setPosts(posts.data)
    }
  } catch (e) {
    console.log('could not initialize account')
  }
}

useEffect(() => {
  initializeAccount()
  return () => console.log('unmount')
})

我曾尝试使用

[]

作为依赖项数组，但出现了一个linting错误，提示将

initializeAccount

移动到依赖项数组。如果我添加它，函数将无休止地运行

---

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

伙计，为了对API调用运行一次useEffect，您必须这样做：

useEffect(() => {
   initializeAccount()
   return () => console.log('unmount')
},[])

---

希望有帮助。

伙计，要为api调用运行一次useEffect，您必须这样做：

useEffect(() => {
   initializeAccount()
   return () => console.log('unmount')
},[])

---

希望有帮助。

如果我这样做，我会得到一个linting错误，说要将依赖项添加到数组中-这是否意味着linting错误不正确？另外，我将在

useffect

中返回什么来中止提取调用？@Toby，这是

request.abort（）

@HMR中的内容，我已经读过了，但我不确定该如何使用它-我将尝试一下，谢谢。@Toby，lint规则仍然很新，非常简单，只需为行添加一个lint覆盖即可。我还建议在上面留下一条评论，关于覆盖的原因，只有在挂载上触发钩子才是一个非常合法的原因。我相信react hooks eslinter的作者正在研究更细粒度的控制/规则，可能只需要等待一段时间。这就是为什么我添加了关于留下评论的内容。我在工作中向我的团队用力推钩子，后来发现了钩子线头，所以不仅要教团队正确使用钩子，还要教团队正确管理线头规则。自动格式化程序也会尝试自动修复lint警告，这就是需要覆盖的原因，注释有助于向其他开发人员解释覆盖的原因，这绝对是故意的。如果我这样做，我会得到一个linting错误，说要将依赖项添加到数组中-这是否意味着linting错误是不正确的？另外，我将在

useffect

中返回什么来中止提取调用？@Toby，这是

request.abort（）

@HMR中的内容，我已经读过了，但我不确定该如何使用它-我将尝试一下，谢谢。@Toby，lint规则仍然很新，非常简单，只需为行添加一个lint覆盖即可。我还建议在上面留下一条评论，关于覆盖的原因，只有在挂载上触发钩子才是一个非常合法的原因。我相信react hooks eslinter的作者正在研究更细粒度的控制/规则，可能只需要等待一段时间。这就是为什么我添加了关于留下评论的内容。我在工作中向我的团队用力推钩子，后来发现了钩子线头，所以不仅要教团队正确使用钩子，还要教团队正确管理线头规则。自动格式化程序也会尝试自动修复lint警告，这就是需要覆盖的原因，注释有助于向其他开发人员解释覆盖的原因，这肯定是故意的。不确定useFetch是否每次都返回相同的引用，但您可以尝试以下操作：

const initializeAccount=useCallback（async（）=>{，，}，[request]）

并将

initializeAccount

传递给useEffect。不确定useFetch是否每次都返回相同的引用，但您可以尝试以下操作：

const initializeAccount=useCallback（async（）=>{，，}，[request]）

并将

initializeAccount

传递给useffect。