Queries
A pasta Queries
abriga os arquivos .graphql a serem executados nas renderizações das páginas e dos snippets.
Exemplo de query
Segue um exemplo de query para pesquisar a palavra "tenis". O retorno apresentará os primeiros dois produtos com os campos solicitados:
query {
search(query:"tenis") {
products(first:2) {
edges {
cursor
node {
id
productId
productName
productVariantId
}
}
}
}
}
Retorno
O retorno para a query realizada anteriormente é o seguinte:
{
"data": {
"search": {
"products": {
"edges": [
{
"cursor": "eyJPZmZzZXQiOjF9",
"node": {
"id": "eyJFbnRpdHkiOiJQcm9kdWN0IiwiSWQiOjM3MjQ2N30=",
"productId": 175349,
"productName": "Tênis Modare Casual 7339.200.19046.52531",
"productVariantId": 372467
}
},
{
"cursor": "eyJPZmZzZXQiOjJ9",
"node": {
"id": "eyJFbnRpdHkiOiJQcm9kdWN0IiwiSWQiOjM3MjQ2MX0=",
"productId": 175348,
"productName": "Tênis Modare Casual Feminino 7354.100.20858.76088",
"productVariantId": 372461
}
}
]
}
}
}
}
Nota
O objeto json de retorno da query é exatamente o que será injetado na página. Então no caso do retorno acima, por exemplo, para ter acesso ao objeto products, é necessário utilizar:
{{ data.search.products }}
Utilização em Pages
Pages
Para utilizar as Queries
em páginas, basta definir o caminho na propriedade query
dentro de Configs/pages.json:
{
"type": "search",
"path": "search.html",
"query": "search.graphql"
}
Utilização em Snippets
Snippets
Para utilizar as Queries
em snippets, basta informar o caminho na chamada de renderização de snippets através do SDK Javascript:
const response = await client.snippet.render("snippet.html", "query.graphql", variables);
Caminhos personalizados
É possível salvar queries
dentro de subpastas em Queries. Para utilizá-las, basta informar os subdiretórios criados em suas respectivas chamadas:
{
"type": "search",
"path": "search.html",
"query": "Search/search.graphql"
}
const response = await client.snippet.render("snippet.html", "Snippet/query.graphql", variables);
Query common
common
Dentro da pasta Queries existe um arquivo chamado common.graphql. Essa query é executada em todas as renderizações de páginas. Dessa forma, informações comuns em todas as páginas podem ser descritas em apenas uma única query, evitando duplicações.
Como utilizar
Para utilizar os objetos da query common.graphql, é possível realizar a chamada Scriban:
{{ common. ... }}
Updated 11 months ago