ion-list
リストは、Text、Buttons、Toggleを含むこと アイテム の複数の行で構成されています。 アイコンやサムネイルなど、さまざまな機能を備えています。リストには一般的に、画像やテキストなど、類似したデータ内容を持つアイテムが含まれます。
リストは、アイテムをスワイプしてオプションを表示したり、ドラッグしてリスト内のアイテムを並び替えしたり、アイテムを削除したりするなどの操作をサポートしています。
基本的な使い方
Inset List
リストに inset プロパティを追加すると、リストの周囲にマージンが適用されます。また、iosモードでは、リストに角丸が追加されます。
List Lines
リストに lines プロパティを追加すると、リスト内のすべてのアイテムの下側のボーダーを調整することができます。 "full"に設定すると全幅のボーダーが表示され、"inset"に設定すると左paddingで調整されたボーダーが表示され、none"に設定するとボーダーが表示されません。リスト内のアイテムに lines プロパティが設定されている場合は、リスト上のプロパティよりもそちらが優先されます。
プロパティ
inset
| Description | trueの場合、リストの周囲に余白ができ、角が丸くなる。 |
| Attribute | inset |
| Type | boolean |
| Default | false |
lines
| Description | すべてのアイテムで、下のボーダーをどのように表示させるか。 |
| Attribute | lines |
| Type | "full" ｜ "inset" ｜ "none" ｜ undefined |
| Default | undefined |
mode
| Description | modeは、どのプラットフォームのスタイルを使用するかを決定します。 |
| Attribute | mode |
| Type | "ios" ｜ "md" |
| Default | undefined |
イベント
No events available for this component.
メソッド
closeSlidingItems
| Description | リスト内で ion-item-sliding が使用されている場合、このメソッドは開いているスライドアイテムを閉じる。 実際に ion-item-sliding が閉じられた場合は true を返します。 |
| Signature | closeSlidingItems() => Promise<boolean> |
CSS Shadow Parts
No CSS shadow parts available for this component.
CSSカスタムプロパティ
No CSS custom properties available for this component.
Slots
No slots available for this component.