React Hooks 是 React 16.8 引入的全新特性，允许函数组件直接使用 state 和生命周期，无需依赖类组件。它解决了函数组件功能受限的问题，让代码更简洁、可维护性更高！🚀

什么是 Hooks？

  • Hooks 是 React 提供的函数，用于“钩住”组件状态和副作用
  • 支持的常用 Hooks：
    • useState：管理状态 🔄
    • useEffect：处理副作用 ⚙️
    • useContext：访问上下文 🌐
    • useReducer：复杂状态逻辑 📦
    • useMemo：优化计算性能 💡

为什么要用 Hooks？

  • 📌 复用逻辑更简单：自定义 Hooks 可提取重复代码
  • 📌 组件结构更清晰：避免组件层级嵌套过深
  • 📌 函数组件功能完整：与类组件功能对等

Hooks 基本使用

import { useState } from 'react';

function Example() {
  const [count, setCount] = useState(0);
  return (
    <div>
      <p>当前计数：{count}</p>
      <button onClick={() => setCount(count + 1)}>点击增加</button>
    </div>
  );
}

学习资源 📚

react_hooks
use_state