ion-list
リストは、Text、Buttons、Toggleを含むこと アイテム の複数の行で構成されています。 アイコンやサムネイルなど、さまざまな機能を備えています。リストには一般的に、画像やテキストなど、類似したデータ内容を持つアイテムが含まれます。
リストは、アイテムをスワイプしてオプションを表示したり、ドラッグしてリスト内のアイテムを並び替えしたり、アイテムを削除したりするなどの操作をサポートしています。
基本的な使い方
Inset List
リストに inset プロパティを追加すると、リストの周囲にマージンが適用されます。また、iosモードでは、リストに角丸が追加されます。
List Lines
リストに lines プロパティを追加すると、リスト内のすべてのアイテムの下側のボーダーを調整することができます。 "full"に設定すると全幅のボーダーが表示され、"inset"に設定すると左paddingで調整されたボーダーが表示され、none"に設定するとボーダーが表示されません。リスト内のアイテムに lines プロパティが設定されている場合は、リスト上のプロパティよりもそちらが優先されます。
プロパティ
inset
| Description | If true, the list will have margin around it and rounded corners. |
| Attribute | inset |
| Type | boolean |
| Default | false |
lines
| Description | How the bottom border should be displayed on all items. |
| Attribute | lines |
| Type | "full" ｜ "inset" ｜ "none" ｜ undefined |
| Default | undefined |
mode
| Description | The mode determines which platform styles to use. |
| Attribute | mode |
| Type | "ios" ｜ "md" |
| Default | undefined |
イベント
No events available for this component.
メソッド
closeSlidingItems
| Description | If ion-item-sliding are used inside the list, this method closes any open sliding item.Returns true if an actual ion-item-sliding is closed. |
| 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.