React函数组件设置相同状态为何出现异常触发重渲染的现象？

你观察到的现象是React 18及以上版本的正常设计，并非bug，核心逻辑如下：

• 当你第一次触发「将state更新为与当前值完全相同」的操作时，React会执行一次谨慎重渲染：仅重新运行组件函数体（这就是你第二次点击同按钮时看到控制台打印abc的原因），但不会触发子组件渲染、DOM更新，也不会执行useEffect等副作用。
• 这次额外的函数执行是React的校验逻辑：用于确认当前组件是纯组件，函数执行过程中不会产生额外的状态变更，避免直接跳过渲染导致逻辑异常。
• 校验完成后，React确认组件确实没有任何需要更新的内容，会给该组件打上「同值更新可跳过」的标记，之后所有触发同值state更新的操作，都会直接跳过组件函数执行，也就不会再有abc打印，完全符合官方文档的规则。

小提示：这次额外的组件函数执行性能损耗极低，因为React不会执行渲染流程后续的DOM diff、DOM更新等重开销步骤，对业务没有实际影响。如果要完全避免这次执行，可以在调用setter前自行判断新旧值是否相等，只有不等时再执行更新，或者用React.memo包裹组件。

内容的提问来源于stack exchange，提问作者Aashish Aggarwal