GraphQL 查询限制标签计数

GraphQL query limiting tag count

这是来自 gatsby 项目的 GraphQL 查询:

const Data = useStaticQuery(graphql`
    query {
      allMarkdownRemark(
        sort: { fields: [frontmatter___date], order: DESC }
        limit: 5
      ) {
        edges {
          node {
            excerpt(pruneLength: 300)
            fields {
              slug
            }
            frontmatter {
              date(formatString: "DD [<span>] MMM [</span>]")
              title
              description
              tags
            }
          }
        }
        group(field: frontmatter___tags) {
          totalCount
          fieldValue
        }
      }
    }
  `);

  const Posts = Data.allMarkdownRemark.edges;
  const Tags = Data.allMarkdownRemark.group;

以上代码用于显示最新的5个帖子和所有标签(包括每个标签的数量)。问题是在显示 5 个最新帖子后,它只显示 5 个标签。

如果我将 2000 的限制应用到组部分,如下所示,我在执行 gatsby develop 时出错。

group(field: frontmatter___tags, limit: 2000)

这是我的 GraphQL IDE 查询输出:

{
  allMarkdownRemark(sort: {fields: id}) {
    group(field: frontmatter___tags) {
      totalCount
      fieldValue
    }
  }
}

输出:

{
  "data": {
    "allMarkdownRemark": {
      "group": [
        {
          "totalCount": 27,
          "fieldValue": "android"
        },
        {
          "totalCount": 24,
          "fieldValue": "c"
        },
        {
          "totalCount": 42,
          "fieldValue": "chash"
        },
        {
          "totalCount": 31,
          "fieldValue": "cplus"
        },
        {
          "totalCount": 36,
          "fieldValue": "css"
        },
        {
          "totalCount": 22,
          "fieldValue": "html"
        },
        {
          "totalCount": 24,
          "fieldValue": "html5"
        },
        {
          "totalCount": 30,
          "fieldValue": "java"
        },
        {
          "totalCount": 11,
          "fieldValue": "jsp"
        },
        {
          "totalCount": 18,
          "fieldValue": "mysql"
        },
        {
          "totalCount": 37,
          "fieldValue": "networking"
        },
        {
          "totalCount": 33,
          "fieldValue": "php"
        },
        {
          "totalCount": 8,
          "fieldValue": "xml"
        }
      ]
    }
  },
  "extensions": {}
}

最新帖子的 5 个限制以某种方式应用于要显示的标签数。

在那种情况下,运行 通过给每个查询一个别名来进行多次查询。

这是一个例子:

const Data = useStaticQuery(graphql`
    query {
      posts: allMarkdownRemark(
        sort: { fields: [frontmatter___date], order: DESC }
        limit: 5
      ) {
        edges {
          node {
            excerpt(pruneLength: 300)
            fields {
              slug
            }
            frontmatter {
              date(formatString: "DD [<span>] MMM [</span>]")
              title
              description
              tags
            }
          }
        }
      }
      tags: allMarkdownRemark(
        sort: { fields: [frontmatter___date], order: DESC }
        limit: 1000
      ) {
        group(field: frontmatter___tags) {
          totalCount
          fieldValue
        }
      }
    }
  `);

  const Posts = Data.posts.edges;
  const Tags = Data.tags.group;