使用盖茨比插件类别/盖茨比插件标签标记云和类别列表

Question

我想创建一个标签云(或类别列表(，它应该链接到相应的标记文章和类别。但在我构建的查询中，只有name或slug被连接起来，因为它们要么被放置在fields中，要么被放在frontmatter中，但不在一个对象中

我使用这两个广泛使用的插件：https://github.com/rmcfadzean/gatsby-pantry

这是我当前的查询：

{
tags: allMarkdownRemark(filter: {frontmatter: {title: {ne: ""}}}) {
group(field: frontmatter___tags) {
fieldValue
totalCount
edges {
node {
fields {
tags
}
frontmatter {
tags
}
}
}
}
}
}

{
"data": {
"allMarkdownRemark": {
"group": [
{
"fieldValue": "Another tag",
"totalCount": 1,
"edges": [
{
"node": {
"fields": {
"tags": [
"another-tag",
"my-example",
"post"
]
},
"frontmatter": {
"tags": [
"Another tag",
"My example",
"Post"
]
}
}
}
]
},
{
"fieldValue": "Example",
"totalCount": 1,
"edges": [
{
"node": {
"fields": {
"tags": [
"example",
"post"
]
},
"frontmatter": {
"tags": [
"Example",
"Post"
]
}
}
}
]
},
{
"fieldValue": "My example",
"totalCount": 1,
"edges": [
{
"node": {
"fields": {
"tags": [
"another-tag",
"my-example",
"post"
]
},
"frontmatter": {
"tags": [
"Another tag",
"My example",
"Post"
]
}
}
}
]
},
{
"fieldValue": "Post",
"totalCount": 2,
"edges": [
{
"node": {
"fields": {
"tags": [
"another-tag",
"my-example",
"post"
]
},
"frontmatter": {
"tags": [
"Another tag",
"My example",
"Post"
]
}
}
},
{
"node": {
"fields": {
"tags": [
"example",
"post"
]
},
"frontmatter": {
"tags": [
"Example",
"Post"
]
}
}
}
]
}
]
}
},
}

我如何获得这样的对象：

{ "tags": 
[
{ "slug": "another-tag", "frontmatter": "Another Tag"},
{ "slug": "example", "frontmatter": "Example"}
]
}

Answer 1

我当前的方法是在视图本身中。我遍历fields.tags并在数组中搜索它们。我保存索引并将其用于frontmatter.tag(它们很高兴地处于相同的顺序(

正是这个代码：

<ul className="tagcloud">
{tags.group.map((tag, idx) => {
var index = tag.edges[0].node.frontmatter.tags.indexOf(
tag.fieldValue
)
return (
<li key={idx}>
<Link
to={`/tags/${tag.edges[0].node.fields.tags[index]}`}
className="transition link"
>
{tag.fieldValue}
</Link>
</li>
)
})}
</ul>