gatsby在react组件中静态查询，不返回任何数据

在react组件中使用静态查询似乎运气不佳。在页面上似乎可以很好地工作，但在组件上却无法工作。基本上，｛data｝总是以未定义的形式出现。已尝试allMarkdownRemark&markdownRemark与不同的Graphql代码片段。当直接通过graphql客户端而不是通过react组件进行查询时，查询将返回正确的数据。

import React from "react";
import { StaticQuery, graphql } from "gatsby";
import { Link } from "gatsby";
import logo from "../../assets/images/logo.png";
import footerMap from "../../assets/images/footer-map.png";
export default () => {       
return (
<StaticQuery
query={graphql`query FooterData {
allMarkdownRemark(filter: {frontmatter: {componentKey: {eq: "Footer"}}}) {
edges {
node {
frontmatter {
explore {
footerlinks1
footerlinks1Url
}
headoffice {
Address
HOAddress
HONumber
}
services {
footerlinks2
footerlinks2Url
}
}
}
}
}
}
`}
render={(data) => (
<footer className="footer-area bg-color">
<div className="container">
<div className="row">
<div className="col-lg-4 col-sm-6">
<h3>Explore</h3>
<ul className="footer-links-list">
{
data.allMarkdownRemarks.edges[0].node.frontmatter.explore.map(link => (
<li>
<Link to={link.footerlinks1Url}>{link.footerlinks1}</Link>          
</li>
))}
</ul>
</div>
</div>
</div>
</footer>
)}
/>
)};
我得到的错误如下。===========================TypeError:无法读取未定义的属性"edges"提供C：/Users/HP/source/XX/src/components/App/Footer.js:10299|<div className="单页脚小部件pl-5">100|<h3>浏览<h3>101 |>102|<ul className="；页脚链接列表">103 |{104|data.allMarkdownRemarks.edges[0].node.fronMatter.explore.map(link=>105|<李>视图已编译StaticQueryDataRendererC：/Users/HP/source/XXX/.cache/gatsby浏览器条目.js:3734|：combinedStaticQueryData[query]&amp；combinedStaticQueryData[query].data35 |36|返回(>37|<反应片段>38|{finalData&&render(finalData(}39|{！finalData&&<div>加载(StaticQuery(</div>}40|<反应片段>视图已编译▶19个堆叠框架倒塌。此屏幕仅在开发中可见。如果应用程序在生产中崩溃，它将不会出现。打开浏览器的开发人员控制台以进一步检查此错误

{data.allMarkdownRemark.edges[0].node.frontmatter.explore.map(link => (
<li>
<Link to={link.footerlinks1Url}>{link.footerlinks1}</Link>          
</li>
))}