状态变化会卸载函数组件吗？setState后useEffect清理函数是否执行？

问题1：状态变化是否会在重渲染过程中卸载函数组件？ #

• 不会。函数组件的重渲染只是重新执行组件函数，以此计算更新后的JSX并同步到DOM，组件实例并未被卸载。
• 组件卸载仅发生在组件从DOM树中被移除的场景，比如路由切换、条件渲染中组件不再满足渲染条件等情况。重渲染过程中，React会通过Hook（如useState、useRef）保留组件的状态和内部引用。

问题2：调用setState后，console.log("return")会运行吗？ #

会运行。原因如下：

1. 代码中的useEffect没有设置依赖数组，意味着每次组件渲染时都会执行这个useEffect。
2. 组件挂载时，第一个useEffect执行，内部调用setNote触发组件重渲染。
3. 组件重渲染前，React会先执行上一次useEffect返回的清理函数，也就是() => console.log("return")，所以这段代码会被触发执行。
4. 重渲染完成后，新的useEffect会再次执行。

补充：如果给useEffect添加正确的依赖数组（比如[notes, noteId]），可以避免不必要的重复执行和清理，优化组件性能。

内容的提问来源于stack exchange，提问作者Vishal Sangole