#javascript #reactjs #graphql #contentful
Вопрос:
Я пытаюсь использовать Graphql для возврата определенного экземпляра объекта.
Это мой запрос Graphql:
query MyQuery {
allContentfulFlexStyleBody {
edges {
node {
image {
file {
url
}
}
}
}
}
}
Он возвращает 3 Узла:
{
"data": {
"allContentfulFlexStyleBody": {
"edges": [
{
"node": {
"image": {
"file": {
"url": "//images.ctfassets.net/m7ipc0qjqa17/6JTBUN3mkENLvEVuC/6ff4b2da441f1c7cec2eb401534aa749/-19.jpeg"
}
}
}
},
{
"node": {
"image": {
"file": {
"url": "//images.ctfassets.net/m7ipc0qjqa17/2s6lg5oBJ7F780DI1/b4068dcc9cc889dbcd09ed992793e771/-BTS.png"
}
}
}
},
{
"node": {
"image": {
"file": {
"url": "//images.ctfassets.net/m7ipc0qjqa17/6bRRjlI1nLFCdUawZ/12af617d352b21864192dcc033198951/MyStylist_Photo_Grid_Layout__Retouched_Photos_Shortlist-6.jpeg"
}
}
}
}
]
}
},
"extensions": {}
}
Я пытаюсь отобразить одно изображение в рамках моего проекта Гэтсби как таковое:
{data.allContentfulFlexStyleBody.edges.map(({ node }, index) => (
<img
className={"contentFeatureImg"}
alt={``}
key={``}
src={node.image.file.url}
/>
))}
Отображаются все изображения. Как мне получить доступ исключительно к первому, второму или третьему узлу, не возвращая весь массив ребер?
Комментарии:
1. Вы имеете в виду, что хотите отобразить только одно изображение? Или вы хотите запросить только определенное изображение (например, с идентификатором) на сервере GraphQL?
2. запросите одно изображение
3. Можете ли вы проверить схему? Скорее всего, есть запрос, в котором вы можете получить всю информацию об одном изображении.
4.
...edges[0].node.image.file.url
5. Я спрашиваю довольного у Гэтсби, что схемы нет
Ответ №1:
Доступ к определенному элементу массива edge работает достаточно для того, что я здесь делаю:
<img
className={"contentFeatureImg1"}
alt={``}
key={``}
src={data.allContentfulFlexStyleBody.edges[0].node.image.file.url}
/>