useEffect和useLayoutEffect有什么区别
useEffect 和 useLayoutEffect 是 React 中的两个 Hook，它们都用于处理副作用，但是在执行时机和使用场景上有所不同。以下是它们的主要区别：
1. 执行时机
useEffect:
在组件渲染后执行，且在浏览器绘制后进行。
适合用于处理不影响布局的副作用，比如数据获取、事件监听等。
useLayoutEffect:
在浏览器绘制之前执行。
适合用于需要直接读取 DOM 布局并同步触发重渲染的副作用，比如测量 DOM 元素的尺寸或位置。
2. 性能影响
useEffect:
不会阻塞浏览器绘制，因此对用户体验的影响较小。
useLayoutEffect:
由于会阻塞浏览器绘制，可能导致性能问题，尤其是当副作用较重时。
3. 使用场景
useEffect：
数据获取
订阅事件
清理定时器
useLayoutEffect：
读取和同步 DOM 布局
动画效果的测量
需要在浏览器绘制前更新状态的场景
示例
import React, { useEffect, useLayoutEffect } from 'react