这很可能是一个愚蠢的问题——我的理解是,任何触发副作用的事情都应该用 useEffect
来处理。 .我想知道这种理解是否正确。特别是在进行 API 调用的上下文中——在 useCallback
中进行 API 调用是否好?钩?
最佳答案
如果你想根据某种 Prop 或状态变化来做,请使用 useEffect
钩子(Hook),例如,
useEffect(async ()=> {
const user = await userApi.get(props.id)
setUser(user)
}, [props.id]}
如果您想通过单击按钮(或任何事件)来执行此操作,const handleClick = () => {
const user = await userApi.get(props.id)
setUser(user)
}
useCallback
并不真正依赖于 api 调用或副作用。 useCallback
基本上是根据依赖关系存储函数的“版本”。当依赖项发生变化时,您会得到一个新函数,因为它返回的内容会有所不同,例如,// props.id = 1
const doSomethingCallback = useCallback(() => {
/* do something with props.id */
}, [props.id])
虽然 props.id === 1
, doSomethingCallback
将始终引用在第一次渲染时声明的函数。如 props.id
更改为 2,useCallback
将引用一个新函数。所以,如果 doSomethingCallback
是 useEffect
的依赖项, 当 props.id
改为 2,useCallback
将指向一个新函数,然后该函数会被 useEffect
注意到并运行其中的任何内容,例如,useEffect(() => { /* side-effect stuff */}, [doSomethingCallback])
关于reactjs - 使用 useEffect 与使用 useCallback 处理 API 调用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/63333044/