为什么组件主体中的 setState 即使设置相同的初始值也会导致无限循环？

Question

下面的代码不应该触发重新渲染，因为它传递了相同的初始值，对吧？但它反而会导致“重新渲染次数过多”错误。

function Test() {
   const [counter, setCounter] = useState(0)
   setCounter(0)
   return <></>
}

编辑：如果您在函数中 setCounter(0) 并将其附加到按钮单击，它不会触发重新渲染，因为它具有相同的值，那么为什么当放置在组件主体中时它会触发重新渲染？我知道 useEffect 具有空依赖数组以避免无限循环。

如果你这样做，你会发现它不会重新渲染：

function Test() {
   const [counter, setCounter] = useState(0)

   console.log('render');

   const set = () => {
     setCounter(0)
   };

   return <button onClick={set}>Set</button>
}

Answer 1

我希望还不算太晚，但我也问了同样的问题，并得到了一个非常好的、合乎逻辑的解释。

有些人可能认为setState即使状态相同，该函数也会触发重新渲染 -这根本不是真的。

请参阅我的问题的链接：直接在组件主体中将状态更新为相同状态