JSS ReactサンプルアプリのUIコンポーネント
Version: 22.x
日本語翻訳に関する免責事項
このページの翻訳はAIによって自動的に行われました。可能な限り正確な翻訳を心掛けていますが、原文と異なる表現や解釈が含まれる場合があります。正確で公式な情報については、必ず英語の原文をご参照ください。
ReactのSitecore JavaScriptレンダリングSDK (JSS) を使用して構築されたアプリケーション内のUIコンポーネントは、fieldsプロパティを提供するPlaceholderコンポーネント内に動的に追加される点を除き、他のReactコンポーネントと変わりません。例えば:
以下は、JSSアプリケーションでのReactコンポーネント定義の例です。
RequestResponse
import React from 'react';
import { Text } from '@sitecore-jss/sitecore-jss-react';
const Welcome = ({ fields }) => (
<View>
<Text field={fields.title} />
</View>
);
export default Welcome;
Welcomeコンポーネントは、内部コンポーネントの状態やライフサイクルメソッドの必要性がないため、ステートレスな関数型コンポーネントとして記述されていますが、ES6クラス構文を使用してReact.Component.JSSは、通常のReact規約の使用に制限を設けていません。
Sitecoreフィールド タイプの処理
JSS for Reactは、Sitecoreフィールド タイプを処理するためのヘルパー コンポーネントを提供します。ヘルパー コンポーネントは、Sitecoreフィールド値をレンダリングし、高度なSitecoreエディターでフィールド編集を可能にする特別なコンポーネントです。
ReactのJSSには 、テキスト、画像、日付、リッチテキストなどのフィールドタイプを表示するためのコンポーネントが含まれています。
先端
利用可能なすべてのコンポーネントのライブ例については、JSS Reactサンプルアプリケーションのスタイルガイドページを参照してください。