コードファーストのJSSアプリで統合GraphQLクエリでレイアウトデータをカスタマイズできます
このページの翻訳はAIによって自動的に行われました。可能な限り正確な翻訳を心掛けていますが、原文と異なる表現や解釈が含まれる場合があります。正確で公式な情報については、必ず英語の原文をご参照ください。
統合されたGraphQLを使えば、Sitecoreレイアウトサービスから受け取るコンポーネントのデータをカスタマイズできます。
コードファーストJSSアプリでは、統合GraphQLクエリによるクエリの仕組みはSitecoreファーストアプリケーションと同じですが、実行すべきGraphQLクエリはJSSマニフェストに提供され、SitecoreアイテムのgraphQLQueryフィールドにインポートされます。
コンポーネントの統合GraphQLクエリを定義するには:
-
コンポーネントのマニフェスト定義ファイルを特定します。例えば、/sitecore/definitions/components/MyComponent.sitecore.js。
-
クエリ/sitecore/definitions/components/MyComponent.sitecore.graphqlを格納するための並列.graphqlファイルを作成します。
-
コンポーネントのマニフェスト定義ファイルで、/sitecore/definitions/components/MyComponent.sitecore.graphqlファイルからクエリ定義GraphQLの内容を読み込み、graphQLQueryプロパティを使ってクエリをコンポーネント定義に付け加えます。例えば:
import { readFileSync } from 'fs';
const query = readFileSync( 'sitecore/definitions/components/ComponentName.sitecore.graphql', 'utf8' );
export default manifest => { manifest.addComponent({ name: "ComponentName", graphQLQuery: query }); };
!注クエリファイルをlintedできるようにGraphQLクエリを含めるためにreadFileSyncを使うことを推奨しますが、リテラル文字列の使用も可能です。解析されたGraphQLクエリAST( graphql-tagのgqlヘルパーを使ったもの)は許可 されていません 。