Collections 由于我的GraphQL查询出错,生成失败
字段“类别”不是由MarkdownRemarkFrontmatterFilterInput类型定义的。这是什么意思,请告知 我使用Netlify CMS作为Gatsbyjs前端的内容管理器。我使用这个初学者模板的方式显示标签,我希望类似地显示类别,因此我复制了它的标签相关文件,并用类别集合替换标签,同时在config.yml文件中添加了类别集合。下面是代码生成错误错误在index.js文件中 category.js这是我的模板文件,用于列出所有类别以及该类别的全部博客Collections 由于我的GraphQL查询出错,生成失败,collections,graphql,gatsby,netlify-cms,Collections,Graphql,Gatsby,Netlify Cms,字段“类别”不是由MarkdownRemarkFrontmatterFilterInput类型定义的。这是什么意思,请告知 我使用Netlify CMS作为Gatsbyjs前端的内容管理器。我使用这个初学者模板的方式显示标签,我希望类似地显示类别,因此我复制了它的标签相关文件,并用类别集合替换标签,同时在config.yml文件中添加了类别集合。下面是代码生成错误错误在index.js文件中 category.js这是我的模板文件,用于列出所有类别以及该类别的全部博客 您需要为此字段添加一些初始
您需要为此字段添加一些初始数据。如果您查看console,可能会看到这样的情况:
- 您希望有选择地使用您的字段,但现在它没有在任何地方使用。因此盖茨比无法推断出类型并将其添加到 GraphQL模式。一个快速修复方法是添加至少一个具有该属性的条目 字段(“虚拟内容”)
您需要为此字段添加一些初始数据。如果您查看console,可能会看到这样的情况:
- 您希望有选择地使用您的字段,但现在它没有在任何地方使用。因此盖茨比无法推断出类型并将其添加到 GraphQL模式。一个快速修复方法是添加至少一个具有该属性的条目 字段(“虚拟内容”)
有人来帮我,我真的被卡住了。有人来帮我,我真的被卡住了。
import React from 'react'
import { Helmet } from 'react-helmet'
import { Link, graphql } from 'gatsby'
import Layout from '../components/Layout'
class CategoryRoute extends React.Component {
render() {
const posts = this.props.data.allMarkdownRemark.edges
const postLinks = posts.map((post) => (
<li key={post.node.fields.slug}>
<Link to={post.node.fields.slug}>
<h2 className="is-size-2">{post.node.frontmatter.title}</h2>
</Link>
</li>
))
const category = this.props.pageContext.category
const title = this.props.data.site.siteMetadata.title
const totalCount = this.props.data.allMarkdownRemark.totalCount
const categoryHeader = `${totalCount} post${
totalCount === 1 ? '' : 's'
} tagged with “${category}”`
return (
<Layout>
<section className="section">
<Helmet title={`${category} | ${title}`} />
<div className="container content">
<div className="columns">
<div
className="column is-10 is-offset-1"
style={{ marginBottom: '6rem' }}
>
<h3 className="title is-size-4 is-bold-light">{categoryHeader}</h3>
<ul className="taglist">{postLinks}</ul>
<p>
<Link to="/category/">Browse all category</Link>
</p>
</div>
</div>
</div>
</section>
</Layout>
)
}
}
export default CategoryRoute
export const categoryPageQuery = graphql`
query CategoryPage($category: String) {
site {
siteMetadata {
title
}
}
allMarkdownRemark(
limit: 1000
sort: { fields: [frontmatter___date], order: DESC }
filter: { frontmatter: { category: { in: [$category] } } }
) {
totalCount
edges {
node {
fields {
slug
}
frontmatter {
title
}
}
}
}
}
`
import React from 'react'
import { kebabCase } from 'lodash'
import { Helmet } from 'react-helmet'
import { Link, graphql } from 'gatsby'
import Layout from '../../components/Layout'
const CategoryPage = ({
data: {
allMarkdownRemark: { group },
site: {
siteMetadata: { title },
},
},
}) => (
<Layout>
<section className="section">
<Helmet title={`Category | ${title}`} />
<div className="container content">
<div className="columns">
<div
className="column is-10 is-offset-1"
style={{ marginBottom: '6rem' }}
>
<h1 className="title is-size-2 is-bold-light">Categories</h1>
<ul className="taglist">
{group.map((category) => (
<li key={category.fieldValue}>
<Link to={`/category/${kebabCase(category.fieldValue)}/`}>
{category.fieldValue} ({category.totalCount})
</Link>
</li>
))}
</ul>
</div>
</div>
</div>
</section>
</Layout>
)
export default CategoryPage
export const categoryPageQuery = graphql`
query CategoryQuery {
site {
siteMetadata {
title
}
}
allMarkdownRemark(limit: 1000) {
group(field: frontmatter___category) {
fieldValue
totalCount
}
}
}
`
- name: category
label: Category
identifier_field: slug
folder: src/pages/blog/category
create: true
fields:
-label: Template Key
name: templateKey
widget: hidden
default: category
- label: Category
name: category
widget: string
- label: Category Image
name: category_img
widget: image
- label: Slug
name: slug
widget: string
- name: blog
label: Blog
folder: src/pages/blog
create: true
slug: "{{year}}-{{month}}-{{day}}-{{slug}}"
fields:
- label: Template Key
name: templateKey
widget: hidden
default: blog-post
- label: Title
name: title
widget: string
- label: Path
name: path
widget: hidden
default: blog-post
- label: Publish Date
name: date
widget: datetime
- label: Description
name: description
widget: text
- label: Featured Post
name: featuredpost
widget: boolean
- label: Featured Image
name: featuredimage
widget: image
- label: Body
name: body
widget: markdown
- label: Tags
name: tags
widget: list
- label: Category
name: category
widget: select
options:
- label: Iraq
value: iraq
- label: Personal
value: personal
- label: Productivity
value: productivity
- label: Software Development
value: software-development
- label: Uncategorized
value: uncategorized