В Contentful я создал новую модель контента под названием «Домашняя страница» с идентификатором типа контента, установленным на «homePage». Я сделал одну запись контента, в которой я хотел бы установить контент для домашней страницы моего сайта. Однако я не могу заставить контент рендериться.
Я могу нормально выводить посты, но у меня возникают проблемы с определением логики запроса и вывода одной записи контента.
Я использую https://github.com/gatsbyjs/gatsby-starter-blog в качестве отправной точки.
Вот мой файл index.js, в котором я хотел бы визуализировать контент из моей записи Contentful Home Page:
import React from "react"
import { graphql } from "gatsby"
import Bio from "../components/bio"
import Layout from "../components/layout"
import SEO from "../components/seo"
import HomePostRoll from "../components/homepage/homepage-post-roll"
class BlogIndex extends React.Component {
render() {
const { data } = this.props
const siteTitle = data.site.siteMetadata.title
const homePage = data.allContentfulHomePage
return (
<Layout location={this.props.location} title={siteTitle}>
<SEO
title="All posts"
keywords={[`blog`, `gatsby`, `javascript`, `react`]}
/>
<Bio />
<h1>{homePage.heroTitle}</h1>
<h2>{homePage.heroSubtitle}</h2>
<HomePostRoll />
</Layout>
)
}
}
export default BlogIndex
export const pageQuery = graphql`
query HomePageQuery {
site {
siteMetadata {
title
}
}
allContentfulHomePage {
edges {
node {
heroTitle
heroSubtitle
}
}
}
}
`
А вот мой предварительный файл JSON:
{
"name": "Home Page",
"description": "The Home Page of my site",
"displayField": "heroTitle",
"fields": [
{
"id": "heroImage",
"name": "HeroImage",
"type": "Link",
"localized": false,
"required": false,
"validations": [],
"disabled": false,
"omitted": false,
"linkType": "Asset"
},
{
"id": "heroTitle",
"name": "Hero Title",
"type": "Symbol",
"localized": false,
"required": false,
"validations": [],
"disabled": false,
"omitted": false
},
{
"id": "heroSubtitle",
"name": "Hero Subtitle",
"type": "Symbol",
"localized": false,
"required": false,
"validations": [],
"disabled": false,
"omitted": false
},
{
"id": "featuredPosts",
"name": "Featured Posts",
"type": "Array",
"localized": false,
"required": false,
"validations": [],
"disabled": false,
"omitted": false,
"items": {
"type": "Link",
"validations": [],
"linkType": "Entry"
}
}
],
"sys": {
"space": {
"sys": {
"type": "Link",
"linkType": "Space",
"id": "k40l6sq0500e"
}
},
"id": "homePage",
"type": "ContentType",
"createdAt": "2019-04-16T11:50:47.700Z",
"updatedAt": "2019-04-16T11:53:53.026Z",
"environment": {
"sys": {
"id": "master",
"type": "Link",
"linkType": "Environment"
}
},
"publishedVersion": 3,
"publishedAt": "2019-04-16T11:53:53.026Z",
"firstPublishedAt": "2019-04-16T11:50:48.158Z",
"createdBy": {
"sys": {
"type": "Link",
"linkType": "User",
"id": "1M6eRN4j0dfcDRFLQH2TG0"
}
},
"updatedBy": {
"sys": {
"type": "Link",
"linkType": "User",
"id": "1M6eRN4j0dfcDRFLQH2TG0"
}
},
"publishedCounter": 2,
"version": 4,
"publishedBy": {
"sys": {
"type": "Link",
"linkType": "User",
"id": "1M6eRN4j0dfcDRFLQH2TG0"
}
}
}
}
У меня не возникает проблем с компиляцией при локальном запуске сайта с помощью команды терминала "gatsbyvelop", поэтому я не могу понять, что я делаю неправильно или где мне не удается понять логику.
Не могли бы вы, ребята, помочь мне?