React Hooks是React 16.8引入的函数，使函数组件支持状态（useState）和副作用（useEffect）；useState用于声明和更新状态变量，可多次调用管理多个独立状态；useEffect用于处理数据获取、订阅等副作用，依赖数组控制执行时机，并支持清理函数。
React Hooks 是 React 16.8 引入的一组函数，让函数组件也能使用状态（state）和副作用（side effects），不用写 class 组件。
useState：管理组件的本地状态
它让你在函数组件里声明一个状态变量，并提供更新它的函数。
基本用法是解构出状态值和设置器函数：
const [count, setCount] = useState(0);这里 count 是当前状态值，setCount 是修改它的函数，初始值是 0。
- 每次调用 setCount（比如 setCount(count + 1)），组件会重新渲染，且 count 取得新值
- 可以多次调用 useState 管理多个独立状态，比如同时有 name 和 age
- 初始值可以是任意类型（数字、字符串、对象、数组），甚至可以是函数（用于惰性初始化）：useState(() => computeInitialValue())
useEffect：处理副作用（如数据获取、订阅、手动 DOM 操作）
它替代了 class 组件中的 componentDidMount、componentDidUpdate 和 componentWillUnmount 的组合逻辑。
基本结构：
useEffect(() => {// 副作用逻辑，比如 fetch 数据或添加事件监听
return () => {
// 清理函数（可选），类似 componentWillUnmount
};
}, [依赖数组]);
- 不传第二个参数：每次渲染后都执行（含首次）——慎用，容易导致无限循环或性能问题
- 传空数组 []：只在组件挂载和卸载时执行（类似 componentDidMount + componentWillUnmount）
- 传非空数组（如 [count]）：仅当数组中某个值变化时才重新执行
- 清理函数会在下次 effect 运行前或组件卸载时执行，用来清除定时器、取消请求、移除监听等
一个小例子：计数器 + 页面标题同步
把 count 显示在界面上，同时让 document.title 随之更新：
funct
ion Counter() {const [count, setCount] = useState(0);
useEffect(() => {
document.title = `你点击了 ${count} 次`; // 副作用
}, [count]); // 仅当 count 改变时更新 title
return (
当前计数：{count}
);
}
基本上就这些。Hooks 让逻辑更聚焦、复用更容易，但要注意依赖数组别漏写、别写错，否则容易出 bug。
