我可以在我的Gatsby项目中分别为两个不同的文件夹创建两种不同的graphql查询吗



我是一名新手程序员,最近我想在我的网站上添加一个博客页面。我已经有了一个使用Graphql和.md文件的项目页面,现在我的问题是,每次我尝试用.md创建博客文章时,它也会出现在我的项目页面中,你能用你解决这个问题的经验告诉我吗?我是否必须创建一个单独的查询?甚至我都不知道怎么做?

这是我当前的查询。

export const query = graphql`
query ProjectsPage {
allMarkdownRemark(sort: { fields: frontmatter___date, order: DESC }) {
nodes {
frontmatter {
slug
stack
title
thumb {
childImageSharp {
gatsbyImageData(placeholder: BLURRED, layout: FULL_WIDTH)
}
}
}
id
}
}
}

您可以做的一件简单的事情是在标记文件上添加一个key字段,以区分帖子和项目。这将允许您过滤GraphQL查询。同样,您也可以将标记放在单独的文件夹中,并使用相对/绝对路径进行过滤。

export const query = graphql`
query ProjectsPage {
allMarkdownRemark(filter: { frontmatter: {key: { eq: "project" }}, sort: { fields: frontmatter___date, order: DESC }) {
nodes {
frontmatter {
slug
stack
title
thumb {
childImageSharp {
gatsbyImageData(placeholder: BLURRED, layout: FULL_WIDTH)
}
}
}
id
}
}
}

正如我所说,这种方法假设您已经在markdown文件中创建了一个key: project字段。您可以使用key: article执行同样的操作。

或者,如果需要,可以使用fileAbsolutePath/relativePath以相同的方式将标记放在不同的文件夹中。这种方法将依赖于您的文件系统结构来确定可用的路径。这两种方法都基于过滤查询,选择更适合您的查询。

使用GraphiQL游乐场在localhost:8000/___graphql上测试所有查询、路径和过滤器

最新更新