react出现了Invalid hook call. Hooks can only be called inside of the body of a function component.

这是因为你在函数组件以外使用了 React Hook。根据 React Hook 规则,Hook 只能在函数组件的最顶层作用域中调用。 有几种常见的错误使用方式:

在普通的 JavaScript 函数中使用 Hook 在 class 组件中使用 Hook 在自定义 Hook 内部再调用 Hook 在条件判断或循环中使用 Hook

正确使用 Hook 的方式是: import React, { useState } from 'react';

function Example() { const [count, setCount] = useState(0);

// ... }

// Hook 只能在函数组件的最顶层使用 function Example() { if (someCondition) { const [count, setCount] = useState(0); // 错误 }

const [count, setCount] = useState(0); }

解决方法是确保只在 React 函数组件中且在最顶层作用域使用 Hook。