0

我正在使用Create-React-App和（优秀的）use-http来定制 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 调用中止的正确方法是什么？

4

1 回答 1

2

我的伙计，为了对 api 调用运行一次 useEffect，你必须这样做：

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

希望能帮助到你。

于 2019-09-23T18:28:33.070 回答