JSS Vue.jsサンプルアプリのUIコンポーネント

Version:

日本語翻訳に関する免責事項

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

JSS Vueサンプルアプリケーションは、主にプレゼンテーションコンポーネントにSFC (Single-File Components) を使用しますが、レンダリング関数やインラインテンプレートプロパティなど、Vue.jsでサポートされている任意のコンポーネント宣言および登録方法を使用できます。

JSS for the Vue.jsアプリケーションのコンポーネントは、ステートレスな機能コンポーネントであり、アンビエントフィールドpropを提供するPlaceholderコンポーネント内に動的に追加されるという点で、通常のVue.jsコンポーネントとは異なります。

以下は、JSSアプリケーションでのVueコンポーネント定義の例です。

<template>
  <div>
    <sc-text :field="fields.title" />
  </div>
</template>
<script>
import { Text } from '@sitecore-jss/sitecore-jss-vue';
export default {
name: 'MyComponent',
props: {
fields: {
type: Object,
},
},
components: {
ScText: Text,
},
};
</script>

Sitecoreフィールドのレンダリングを支援するために、Sitecore JavaScript Rendering SDK (JSS) for Vue.jsにはフィールドヘルパーコンポーネントが用意されています。

この記事を改善するための提案がある場合は、お知らせください!