この文章は Salesforce 機械翻訳システムを使用して翻訳されました。詳細はこちらをご参照ください。
英語に切り替える

lightning:accordion

複数のコンテンツ領域を含むセクションを縦に積み上げたコレクション。同時に展開されるのは 1 つのみです。セクションを選択すると、展開されるか折りたたまれます。各セクションには、1 つ以上の Lightning コンポーネントを含めることができます。このコンポーネントはバージョン 41.0 以降で使用できます。

lightning:accordion コンポーネントは、複数のコンテンツ領域を含むセクションを縦に積み上げたコレクションを表示します。同時に展開されるのは 1 つのみです。セクションを選択すると、展開されるか折りたたまれます。各セクションには、1 つ以上の Lightning コンポーネントを含めることができます。

このコンポーネントは、Lightning Design System のアコーディオンからスタイル設定を継承します。

さらにこのコンポーネントのスタイルを設定するには、Lightning Design System ヘルパークラスを使用します。

次の例では、3 つのセクション (セクション B はデフォルトで展開される) がある基本的なアコーディオンを作成します。

1<aura:component>
2   <lightning:accordion activeSectionName="B">
3     <lightning:accordionSection name="A" label="Accordion Title A">This is the content area for section A</lightning:accordionSection>
4     <lightning:accordionSection name="B" label="Accordion Title B">This is the content area for section B</lightning:accordionSection>
5     <lightning:accordionSection name="C" label="Accordion Title C">This is the content area for section C</lightning:accordionSection>
6   </lightning:accordion>
7</aura:component>
使用上の考慮事項

lightning:accordion の最初のセクションはデフォルトで展開されます。デフォルトを変更するには、activeSectionName 属性を使用します。この属性は大文字と小文字を区別します。

複数のセクションで同じ名前が使用されていて、その名前が activeSectionName として指定されている場合、最初のセクションがデフォルトで展開されます。

属性

属性名 属性型 説明 必須項目
activeSectionName String activeSectionName は、デフォルトで展開されるセクションを変更します。アコーディオンの最初のセクションはデフォルトで展開されます。
body Component[] コンポーネントのボディ。マークアップでは、これはタグの��ディに含まれるすべてを指します。
class String コンポーネントの基本クラスに加え、外部要素の CSS クラス。
title String マウスポインタが要素に重ねられたときにツールチップテキストを表示します。