useCallback 是一个 React hook,它的作用是返回一个 memoized 回调函数。这意味着,每当你在函数组件内调用 useCallback,它会在依赖项(第二个参数)没有发生变化时返回一个缓存的函数,并在依赖项发生变化时返回一个新的函数。这对于避免不必要的重渲染很有用,因为如果回调函数没有发生变化,就不会引发组件重新渲染。
举个例子,假设你有一个父组件,它渲染了一个子组件,并传递了一个回调函数作为 props:
function ParentComponent() {
const [count, setCount] = useState(0);
const handleClick = () => setCount(count + 1);
return <ChildComponent onClick={handleClick} />;
}