为什么这个graphql显示TypeError:(..)是未定义的

Question

嗨，我正试图用graphql在博客上展示特色文章，为什么它不起作用？我想展示第一篇不同风格的文章，比如特色文章，然后像文章列表一样休息，所以我试图创建2个不同的graphql，但我被它卡住了。

export default function Featured() {
return (
<StaticQuery
query={graphql`
query HeadingQuery {
allMarkdownRemark {
edges {
node {
frontmatter {
title
}
}
}
}
}


`}
render={data=> (
<h1>{data.allMarkdownRemark.edges.node.frontmatter.title}</h1>
)}
/>
)
}

存在TypeError：(…(是未定义的

Answer 1

您的查询在GraphQL游乐场(localhost:8000/__GraphQL(中工作吗？

此外，渲染方法也有错误。edges是一个数组，所以你应该循环浏览它们来显示你的内容，或者具体地逐个位置输入：

<h1>{data.allMarkdownRemark.edges[0].node.frontmatter.title}</h1>