クエリ

query {

クエリ

query {   pageOne: search(     where: {       AND:         {           name: "_path"           value: "54C8E9B5-0B2C-5363-8FA6-D32A3A302F51"           operator: CONTAINS         }         {           AND:             {               name: "_path"               value: "0C6F4AAF-DD7E-5FAF-B9B0-61070D496055"               operator: NCONTAINS             }             {               name: "_path"               value: "AB99BA2B-B606-51E3-BAD9-FD8358DE1333"               operator: NCONTAINS             }                   }           }     # defaults to 10     first: 10   ) {     total     pageInfo {       endCursor       hasNext     }     results {       url {         path       }     }   } }

結果

検索クエリの結果には、/home/graphqlやhome/styleguide/Page Componentsのパスやその子孫を含む項目は含まれず、/home項目と残りの子項目が返されます。

{   "data": {     "pageOne": {       "total": 5,       "pageInfo": {         "endCursor": "NQ==",         "hasNext": false       },       "results":         {           "url": {             "path": "/styleguide/custom-route-type"           }         },         {           "url": {             "path": "/styleguide"           }         },         {           "url": {             "path": "/Page-Components/home-jss-main-ContentBlock-1"           }         },         {           "url": {             "path": "/Page-Components"           }         },         {           "url": {             "path": "/"           }         }           }   } }

クエリ

query { layout(site: "experienceedge", routePath: "/", language: "en") { item { rendered } } }

結果

{ "data": { "layout": { "item": { "rendered": { "sitecore": { "context": { "pageEditing": false, "site": { "name": "experienceedge" }, "pageState": "normal", "language": "en", "itemPath": "/" }, "route": { "name": "home", "displayName": "home", "fields": { "pageTitle": { "value": "Welcome to Sitecore JSS" } }, "databaseName": "web", "deviceId": "fe5d7fdf-89c0-4d99-9aa3-b5fbd009c9f3", "itemId": "2bde2083-5542-5569-ac5e-f1f42e29f75a", "itemLanguage": "en", "itemVersion": 1, "layoutId": "714096fc-3998-52cf-b87a-951fc7ce39d3", "templateId": "e34d8c4f-7e6c-560c-be24-e4d1fcdb16d8", "templateName": "App Route", "placeholders": { "jss-main": { "uid": "2c4a53cc-9da8-5f51-9d79-6ee2fc671b2d", "componentName": "ContentBlock", "dataSource": "{CC3A044C-776B-5423-9BEA-CC5C2EDA8C9B}", "fields": { "heading": { "value": "Welcome to Sitecore JSS" }, "content": { "value": "

Thanks for using JSS!! Here are some resources to get you started:

<a href=\"https://jss.sitecore.net\\" rel=\"noopener noreferrer\">Documentation

The official JSS documentation can help you with any JSS task from getting started to advanced techniques.

<a href=\"/styleguide\">Styleguide

The JSS styleguide is a living example of how to use JSS, hosted right in this app.\nIt demonstrates most of the common patterns that JSS implementations may need to use,\nas well as useful architectural patterns.

<a href=\"/graphql\">GraphQL

JSS features integration with the Sitecore GraphQL API to enable fetching non-route data from Sitecore - or from other internal backends as an API aggregator or proxy.\nThis route is a living example of how to use an integrate with GraphQL data in a JSS app.

This app is a boilerplate

The JSS samples are a boilerplate, not a library. That means that any code in this app is meant for you to own and customize to your own requirements.

Want to change the lint settings? Do it. Want to read manifest data from a MongoDB database? Go for it. This app is yours.

How to start with an empty app

To remove all of the default sample content (the Styleguide and GraphQL routes) and start out with an empty JSS app:

\n
1. Delete /src/components/Styleguide* and /src/components/GraphQL*
\n
2. Delete /sitecore/definitions/components/Styleguide*, /sitecore/definitions/templates/Styleguide*, and /sitecore/definitions/components/GraphQL*
\n
3. Delete /data/component-content/Styleguide
\n
4. Delete /data/content/Styleguide
\n
5. Delete /data/routes/styleguide and /data/routes/graphql
\n
6. Delete /data/dictionary/*.yml
\n

} } } } } } } }

クエリ

fragment bucketItemFields on Item { ... on AppRoute { pageTitle { value } } url { path } }

query { search( where: { AND: { name: "_templates" value: "0929f436c3f3500a9f8bd1c57a67a192" operator: CONTAINS } { name: "_path" value: "7ab00eca411249818420666fc9110faf" operator: CONTAINS }

} first: 5 orderBy: { name: "pageTitle", direction: ASC } ) { results { ...bucketItemFields } pageInfo { endCursor hasNext } total } }

結果

{ "data": { "search": { "results": { "pageTitle": { "value": "Route A" }, "url": { "path": "/bucket/2021/05/13/13/12/Route-A" } }, { "pageTitle": { "value": "Route B" }, "url": { "path": "/bucket/2021/05/13/13/12/Route-B" } }, { "pageTitle": { "value": "Route C" }, "url": { "path": "/bucket/2021/05/13/13/12/Route-C" } }, { "pageTitle": { "value": "Route D" }, "url": { "path": "/bucket/2021/05/13/13/12/Route-D" } }, { "pageTitle": { "value": "Route E" }, "url": { "path": "/bucket/2021/05/13/13/13/Route-E" } } , "pageInfo": { "endCursor": "NQ==", "hasNext": true }, "total": 26 } } }

クエリ

query { layout(site: "experienceedge", routePath: "/", language: "en") { item { homeItemPath: path contentRoot: parent { id path } } } }

結果

{ "data": { "layout": { "item": { "homeItemPath": "/sitecore/content/Experience-Edge/home", "contentRoot": { "id": "5AAA894246145088B7AD604B4D177B39", "path": "/sitecore/content/Experience-Edge" } } } } }

クエリ

query { pageOne: search( where: { AND: { name: "_path", value: "5AAA894246145088B7AD604B4D177B39", operator: CONTAINS }, { name: "_language", value: "en" }, { name: "_hasLayout", value: "true" }

}

クエリ

fragment navigationFields on Item { ... on AppRoute { pageTitle { value } } url { path } }

query { layout(site: "experienceedge", routePath: "/", language: "en") { item { ...navigationFields children(hasLayout: true, includeTemplateIDs: "e34d8c4f7e6c560cbe24e4d1fcdb16d8") { results { ...navigationFields children(hasLayout: true, includeTemplateIDs: "e34d8c4f7e6c560cbe24e4d1fcdb16d8") { results { ...navigationFields } } } } } } }

結果

{ "data": { "layout": { "item": { "pageTitle": { "value": "Welcome to Sitecore JSS" }, "url": { "path": "/" }, "children": { "results": { "pageTitle": { "value": "GraphQL | Sitecore JSS" }, "url": { "path": "/graphql" }, "children": { "results": { "pageTitle": { "value": "Sample 1 Page Title" }, "url": { "path": "/graphql/sample-1" } }, { "pageTitle": { "value": "Sample 2 Page Title" }, "url": { "path": "/graphql/sample-2" } }

} }, { "pageTitle": { "value": "Styleguide | Sitecore JSS" }, "url": { "path": "/styleguide" }, "children": { "results": { "pageTitle": { "value": "Custom Route Type | Sitecore JSS" }, "url": { "path": "/styleguide/custom-route-type" } }

} }

} } } } }

クエリ

fragment breadcrumbFields on Item { ... on AppRoute { pageTitle { value } } url { path } }

query {

クエリ

query { richTextFieldExample: item(path: "d979794f76fd51829f3ece48d16dc36c", language: "en") { displayName ... on StyleguideFieldUsageRichText { sample { jsonValue } } } imageFieldExample: item(path: "c05be0b464885343b5670145b6815d03", language: "en") { displayName ... on StyleguideFieldUsageImage { sample1 { jsonValue } } } linkFieldExample: item(path: "d299e65e1f6c5ea3b71381c8e2f85baf", language: "en") { displayName ... on StyleguideFieldUsageLink { externalLink { jsonValue } } } }

結果

{ "data": { "richTextFieldExample": { "displayName": "Styleguide-FieldUsage-RichText-3", "sample": { "jsonValue": { "value": "

This is a sample rich text field. HTML is always supported. In Sitecore, editors will see a WYSIWYG editor for these fields.