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