关于React useCallback使用的问题?-灵析社区

## React中的useCallback 下面的代码中`Com`是父组件，`Button`是子组件，子组件接收父组件的`count2`和`setCount2`，子组件中使用了`memo(Button)`导出 function Com() { const [count1, setCount1] = useState(0) const [count2, setCount2] = useState(0) const handleClick1 = () => {setCount1(i => i + 1)} const handleClick2 = () => {setCount2(i => i + 1)} // const callbackSetCount2 = useCallback(() => { // setCount2(i => i + 1) // }, [count2]) console.log("$$ ComA render") return ( this is ComA {count1} setCount1(i => i + 1)}>count1 ++ count2 {count2} ) } 子组件`Button` function Button({ handleClick, children }) { console.log(`$$ Rendering button` + children) return ( this is Button.jsx {children} ) } export default memo(Button) 在上面的代码中，如果点击`count1++`的按钮（不使用useCallback），父组件会重新渲染，但是子组件也会刷新，然而子组件中的`count2`依赖没有变化，所以只能是`handleClick2`函数变化了，这只能是因为父组件重新渲染导致了`const handleClick2 = () => {setCount2(i => i + 1)}`这一行重新运行。 所以我们需要使用`useCallback`来将`handleClick2`函数缓存，不会因为重新渲染而导致没有必要的刷新，这样做之后，点击`count1++`的按钮也不会导致子组件刷新了。 这是我对上面代码以及重新渲染机制以及`useCallback`的理解，这样理解对吗？ 希望理解`useCallback`以及`setState`之后的更新机制，谢谢各位大佬了