您的问题是您使用钩子的方式.基本上，您可以使用某些方法来使用 useStaticQuery 或函数中的任何钩子:

Your problem here is the way you use hook. Basically you have some ways to use useStaticQuery or any hook in a function:

• 该函数需要返回一个 React Component .
• 否则，这应该是HOC.

第一种方法的示例代码:

Example code for first way:

import AnyComponent from '../some-where';
const MockComponent = (props) => {
  const { mockData } = useStaticQuery(anyQuery);

  return (
    <AnyComponent mockData={mockData}>
  )
}
export default MockComponent

第二种方式的示例代码:

Example code for second way:

const withMockHOC = (AnyOtherComponent) => (props) => {
  const { mockData } = useStaticQuery(anyQuery);

  return <AnyOtherComponent {...props} mockData={mockData} />;
};

希望获得帮助.