Как запросить конкретный узел с помощью Graphql?

#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}
  />