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

Question

我的blog.js组件：

import {useStaticQuery, graphql} from "gatsby"


const blog = () => {
    const {site} = useStaticQuery(
        graphql`
      query {
        site {
          siteMetadata {
            title
          }
        }
      }
    `
    )
    return site.siteMetadata
}

export default blog

盖茨比文档：https : //www.gatsbyjs.org/docs/use-static-query/

我试图解决这个问题！

有什么解决办法吗？？

谢谢

Answer 1

将组件的名称大写：

import {useStaticQuery, graphql} from "gatsby"


const Blog = () => {
  const {site} = useStaticQuery(
    graphql`
      query {
        site {
          siteMetadata {
            title
          }
        }
      }
    `
  )
  return site.siteMetadata
}

export default Blog

用户定义的组件必须大写

我们建议使用大写字母命名组件。如果您确实有一个以小写字母开头的组件，请在将其用于 JSX 之前将其分配给一个大写的变量。