JSS React Native サンプル アプリの UI コンポーネント

Version: 20.x
日本語翻訳に関する免責事項

このページの翻訳はAIによって自動的に行われました。可能な限り正確な翻訳を心掛けていますが、原文と異なる表現や解釈が含まれる場合があります。正確で公式な情報については、必ず英語の原文をご参照ください。

React Native 用の Sitecore JavaScript レンダリング SDK (JSS) で構築されたアプリケーションの UI コンポーネントは、他の React Native コンポーネントと何ら変わりはありません。ただし、それらの UI コンポーネントは、fields プロパティを UI コンポーネントに提供する Placeholder コンポーネント内に動的に追加されます。

RequestResponse
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 サンプル アプリケーションのスタイルガイド ページを参照してください。

何かフィードバックはありますか?

この記事を改善するための提案がある場合は、