React中useCallback更新其依赖数组内状态变量时，如何避免无限重渲染？

请参考以下代码

import { useMemo, useState, useCallback } from 'react'


function App() {
  const [count, setCount] = useState(0);

  const handleClick = useCallback(() => {
    setCount(count + 1);

  }, [count]);

  return <div>
    <Child onClick={handleClick} />
  </div>
}


function Child({onClick}) {
  return (
    <button onClick={onClick}>Click here</button>
  )
}

export default App

在上述代码中，当点击文本为Click here的按钮时，count状态变量会被更新，该变量同时也是useCallback的依赖项，useCallback的返回值被作为按钮onClick属性的处理函数。

内容的提问来源于stack exchange，提问作者N. Pamnani