我试图从类别中最新文章的开头内返回FeaturedImage。
这是我当前编写的graphql查询:
query catList {
allMdx(sort: { fields: frontmatter___date, order: DESC }) {
group(field: frontmatter___themes, limit: 1) {
fieldValue
totalCount
nodes {
frontmatter {
featuredImage {
childImageSharp {
fixed(width: 400, height: 400) {
...GatsbyImageSharpFixed
}
}
}
}
}
}
}
}
查询返回的正是我在graphql编辑器中想要的内容,但是当我尝试访问组件中的featuredImage时,出现错误:
“ TypeError:无法读取未定义的属性'featuredImage'”
这是页面和组件的完整代码:
const CatPage = () => (
<StaticQuery
query={graphql`
query themeList {
allMdx(sort: { fields: frontmatter___date, order: DESC }) {
group(field: frontmatter___themes, limit: 1) {
fieldValue
totalCount
nodes {
frontmatter {
featuredImage {
childImageSharp {
fixed(width: 400, height: 400) {
...GatsbyImageSharpFixed
}
}
}
}
}
}
}
}
`}
render={data => (
<Layout>
<Gallery>
{data.allMdx.group.map(theme => (
<GalleryCard to={theme.fieldValue} title={theme.fieldValue}>
<Img
fixed={
theme.nodes.frontmatter.featuredImage.childImageSharp.fixed
}
/>
</GalleryCard>
))}
</Gallery>
</Layout>
)}
/>
)
这里的目标是使每个类别的最新帖子的特色图片成为该类别的封面图片,但是我很难获得要渲染的图片!