Gatsby文件系统路由API:每个数组项的唯一页面

Question

在Gatsby中，我的节点的值包含数组(来自Airtable):

"edges": [
{
"node": {
"data": {
"Name": "Simon",
"Projects": [
"Mainsite", "Backend"
],
"Locations": [
"UK", "USA"
]
}
}
},
...

当我使用盖茨比的文件系统路由API创建动态页面时(例如{airtable.data__Projects}.js)，那么页面将为每个节点中使用的每个数组创建，例如/projects/mainsite-backend/。

如何使每个节点中的每个数组中的每个项目都有自己的页面，例如/projects/mainsite和/projects/backend?

Answer 1

你在{airtable.data__Projects}.js中使用的双下划线(__)符号，我认为它正在创建一个不希望的路由。根据文档:

使用__(双下划线)表示您想要访问a节点上的嵌套字段。您可以根据需要进行尽可能深的嵌套，例如:src/pages/products/{Product.fields__date__createdAt}.js生成以下查询:

allProduct {
nodes {
id # Gatsby always queries for id
fields {
date {
createdAt
}
}
}
}

在你的情况下，我认为你正在尝试做/projects/{airtable.data.Projects}.js。

或者(根据您的规格)，您可以使用name字段(将保存Mainsite和Backend值)在Projects中创建一个嵌套的JSON结构，并适合src/pages/projects/{Project.name}.js