これら 2 つのスクリーンショットは、useStaticQuery の呼び出しから返された同じオブジェクトを示しています。1 つは開発中、もう 1 つは実稼働中です。開発オブジェクトは (graphiql に表示されるように) 想定どおりに見えますが、実稼働上のイメージでは、オブジェクトはまったく異なるフィールドで非常に奇妙であり、その理由がわかりません。
明確にするために、最初の画像は本番用で、2 番目の画像は開発ビルドです
なぜこれが起こっているのか誰か教えてもらえますか?
コンポーネント全体は次のとおりです。
import React from "react"
import { linkResolver } from "../../utils/linkResolver"
import { useStaticQuery, graphql, Link } from "gatsby"
import Nav from "react-bootstrap/Nav"
import Navbar from "react-bootstrap/Navbar"
import NavDropdown from "react-bootstrap/NavDropdown"
const MyNav = () => {
const data = useStaticQuery(graphql`
query myNavQuery {
prismic {
allAffiliates {
edges {
node {
_meta {
id
type
uid
}
about
affiliate_name
author_name
image_1
image_2
map
}
}
}
}
}
`)
const affiliates = data.prismic.allAffiliates.edges
return (
<Navbar collapseOnSelect variant="light" expand="sm">
<Navbar.Brand href="/">
<div className="nav-logo">Global Paradise Studios</div>
</Navbar.Brand>
<Navbar.Toggle aria-controls="basic-navbar-nav" />
<Navbar.Collapse id="basic-navbar-nav">
<Nav className="ml-auto">
<NavDropdown title="Affiliates" id="basic-navbar-dropdown">
{affiliates.map(affiliate => {
return (
<NavDropdown.Item href={linkResolver(affiliate.node._meta)}>
{affiliate.node.affiliate_name[0].text}
</NavDropdown.Item>
)
})}
</NavDropdown>
<Nav.Link as={Link} to="/">
Home
</Nav.Link>
<Nav.Link as={Link} to="/about">
About
</Nav.Link>
<Nav.Link as={Link} to="/contact">
Contact
</Nav.Link>
</Nav>
</Navbar.Collapse>
</Navbar>
)
}
export default MyNav