在既不是 React 函数组件也不是自定义 React Hook 函数的函数中调用 React Hook “useState”

当在 React 中使用 Hook 把一个函数组件转换成一个状态机时，我们需要使用 useState Hook 来定义组件的状态。这是一个非常有用的功能，可以帮助我们更容易地管理组件状态而不使用类组件或 Redux。

但是，在 React 中，不能在既不是 React 函数组件也不是自定义 React Hook 函数的函数中调用 useState。这是因为 Hook 必须只能在 React 函数组件或自定义 React Hook 中调用。如果不符合这些条件，React 会发出有关错误的警告。

以下是一个错误的例子，其中 useState 函数在普通的 JavaScript 函数中调用：

function notAReactComponent() {
  const [count, setCount] = useState(0);
  // Error: Invalid hook call. Hooks can only be called inside of the body of a function component.
}

正确的做法是将函数转换为 React 函数组件或自定义 Hook 函数。

当我们创建自定义 Hook 时，我们会在代码中重复使用一些状态管理逻辑。通过使用 useState 和其他 Hook，我们可以将通用的状态管理逻辑封装到一个可复用的 Hook 中，从而避免重复编写逻辑代码。

如果您想了解更多关于 Hook 的信息，请访问React Hook 官方文档。