react-hook基础使用因为它调用 useState 3 次，React 会在第一次渲染时将这三个 hook 放入

假设咱们有以下这个组件：

function AudioPlayer() {
  const [volume, setVolume] = useState(80);
  const [position, setPosition] = useState(0);
  const [isPlaying, setPlaying] = useState(false);
}

因为它调用 useState 3 次，React 会在第一次渲染时将这三个 hook 放入 Hooks 数组中。

下次渲染时，同样的 3 个 hooks 以相同的顺序被调用，所以 React 可以查看它的数组，并发现已经在位置 0 有一个 useState hook ，所以 React 不会创建一个新状态，而是返回现有状态。

这就是 React 能够在多个函数调用中创建和维护状态的方式，即使变量本身每次都超出作用域。