补充useLayoutEffect:
3. useLayoutEffect —— 同步副作用
对应阶段：DOM 更新后、浏览器绘制前（同步执行）
应用场景：避免视觉闪烁、布局测量、强制同步 DOM 操作。
<div class="note">
<strong>慎用</strong>！仅在 <code>useEffect 无法满足需求时使用，因为它会阻塞渲染。
✅ 案例：同步调整滚动位置
function ScrollingList({ items }) {
const listRef = useRef();
useLayoutEffect(() => {
const { scrollHeight } = listRef.current;
listRef.current.scrollTop = scrollHeight;
}, [items]);
return <ul ref={listRef}>{items.map(i => <li key={i}>{i}</li>)}</ul>;
}