我有:
- src
- data
- data.json
data.json:
"gallery": [
{"name":...
{"name":.. ...
gatsby-config.js包含:
`gatsby-transformer-json`,
{
resolve: `gatsby-source-filesystem`,
options: {
path: `${__dirname}/src/data`,
name: `data`,
},
},
如何通过GraphQL查询从这个json文件中获取gallery.names列表? 我试着写:
export const IndexQuery = graphql`
query IndexQuery {
mydata: file(name: { eq: "data" }, extension: { eq: "json" }) {
allFile {
gallery {
name
}
}
}
}
`
但它没有用。
答案 0 :(得分:5)
您的GraphQL查询需要稍微调整一下。 gatsby-transformer-json
会解决所有问题,因此您无需担心查询中的gatsby-source-filesystem
:
export const IndexQuery = graphql`
query IndexQuery {
dataJson {
gallery {
name
}
}
}
`;
然后在页面/布局中使用它,如:
this.props.data.dataJson.gallery
要调试GraphQL查询,使用内置的 GraphiQL 会很有帮助,它应该在http://localhost:8000/___graphql运行。