如何使用gatsby在graphiQL中基于uid查询一个记录/结果?

时间:2019-05-17 04:42:35

标签: graphql gatsby

我正在使用带有GraphQL的GatsbyJS。我都是新来的。对于我一生,我无法弄清楚如何通过uid值使用graphql查询单个记录。 我有一个简单的json文件。在GraphiQL中,此查询的输出。...

query{
  allDataJson{
    edges {
      node {
        products{
          uid
          sku
          title 
          price
          image
        }
      }
    }
  }
}

将所有记录提供给我。

{
  "data": {
    "allDataJson": {
      "edges": [
        {
          "node": {
            "products": [
              {
                "uid": 0,
                "sku": "8509698P",
                "title": "Cindy Crawford Home Bellingham Slate Sofa",
                "price": 655,
                "image": "https://images.rtg-prod.com/cindy-crawford-home-bellingham-slate-sofa_8509698P_image.png?w=150"
              },
              {
                "uid": 1,
                "sku": "10132859",
                "title": "Sofia Vergara Pacific Palisades Navy Plush Sofa",
                "price": 799.99,
                "image": "https://images.rtg-prod.com/sofia-vergara-pacific-palisades-navy-sofa_10132859_image.png?w=150"
              },
              {
                "uid": 2,
                "sku": "15028930",
                "title": "Eric Church Highway To Home Headliner Brown Leather Dual Power Reclining Sofa",
                "price": 1599.99,
                "image": "https://images.rtg-prod.com/eric-church-highway-to-home-headliner-brown-leather-power-plus-reclining-sofa_15028930_image.png?w=150"
              },
              {
                "uid": 3,
                "sku": "10141620",
                "title": "Bonita Springs Gray Sofa",
                "price": 499.99,
                "image": "https://images.rtg-prod.com/bonita-springs-gray-sofa_10141620_image.png?w=150"
              },
              {
                "uid": 4,
                "sku": "14103941",
                "title": "Villa Capri Blue Leather Sofa",
                "price": 899.99,
                "image": "https://images.rtg-prod.com/villa-capri-blue-leather-sofa_14103941_image.png?w=150"
              },
              {
                "uid": 5,
                "sku": "8509697P",
                "title": "Cindy Crawford Home Bellingham Indigo Sofa",
                "price": 655,
                "image": "https://images.rtg-prod.com/cindy-crawford-home-bellingham-indigo-sofa_8509697P_image.png?w=150"
              },
              {
                "uid": 6,
                "sku": "8509695P",
                "title": "Cindy Crawford Home Bellingham Cardinal Microfiber Sofa",
                "price": 655,
                "image": "https://images.rtg-prod.com/cindy-crawford-home-bellingham-cardinal-sofa_8509695P_image.png?w=150"
              },
              {
                "uid": 7,
                "sku": "10132950",
                "title": "Cindy Crawford Home Chelsea Hills Gray Sofa",
                "price": 799.99,
                "image": "https://images.rtg-prod.com/cindy-crawford-home-chelsea-hills-gray-sofa_10132950_image.png?w=150"
              },
              {
                "uid": 8,
                "sku": "10197704",
                "title": "Ivyleigh Silver Sofa",
                "price": 599.99,
                "image": "https://images.rtg-prod.com/ivyleigh-silver-sofa_10197704_image.png?w=150"
              },
              {
                "uid": 9,
                "sku": "10131403",
                "title": "Court Street Beige Sofa",
                "price": 599.99,
                "image": "https://images.rtg-prod.com/court-street-beige-sofa_10131403_image.png?w=150"
              }
            ]
          }
        }
      ]
    }
  }
}

如何查询单个uid?

query{
  allDataJson(filter: ??? ){
    edges {
      node {
        products{
          uid
          sku
          title 
          price
          image
        }
      }
    }
  }
}

这样我的结果就是这样?

{
  "data": {
    "allDataJson": {
      "edges": [
        {
          "node": {
            "products": [
              {
                "uid": 0,
                "sku": "8509698P",
                "title": "Cindy Crawford Home Bellingham Slate Sofa",
                "price": 655,
                "image": "https://images.rtg-prod.com/cindy-crawford-home-bellingham-slate-sofa_8509698P_image.png?w=150"
              },
            ]
          }
        }
      ]
    }
  }
}

3 个答案:

答案 0 :(得分:0)

您需要在查询args中发送ID,BE应该仅基于ID返回单个记录。像下面。

query{


allDataJson(id:1 ){
    edges {
      node {
        products{
          uid
          sku
          title 
          price
          image
        }
      }
    }
  }
}

答案 1 :(得分:0)

GraphiQL还应向您建议查询dataJson。尽管allDataJson为您提供了连接(因此为数组),但是dataJson仅返回单个结果-通常与过滤器配合使用。

所以这样的事情应该可以工作(我自己无法在GraphiQL中尝试):

query {
  dataJson(products: { uid: { eq: 2 } }) {
    products {
      uid
    }
  }
}

请通过自动完成GraphiQL尝试一下。

答案 2 :(得分:0)

其他答案指出了Gatsby中graphql的过滤功能,但您的情况有所不同:您的乘积是数组。默认情况下,您无法过滤字段返回的数组-数组中的每个项目都必须是一个节点。

如果您可以从中转换数据结构,它将变得更加容易

// data.json
{
  products: [{ "uid": 0 }, { "uid": 1 }]
}

...类似这样:

// data.json
[{ "uid": 0 }, { "uid": 1 }]

...并将您的元数据存储在其他位置。

这样,数组中的每个项目都将成为一个节点,您可以按预期进行过滤。

{
  allDataJson(filter: {
    uid: {eq: 1}
  }) {
    edges {
      node {
        id
      }
    }
  }
}

如果无法更改json数据结构,您还可以编写自己的gatsby-transformer-json,只需读取json文件并为产品列表中的每个项目创建一个节点。