# Timelines
v-timeline
は時系列の情報を綺麗に表示したいときに便利です。
# 使い方
最も単純な形式のv-timeline
は、少なくとも1つのv-timeline-item
を含む垂直タイムラインを表示します。
# API
# サンプル
# Props
# 色
色付きのドットで、タイムラインを読みやすくする視覚的なブレークポイントを作成します。
# Dense
dense タイムライン すべてのコンテンツを右に配置します。 この例では、 カード部分に別のデザインを適用させるためにv-alert
で置き換えています。
# アイコンドット
条件に応じて v-timeline-item
のドット内のアイコンをカスタマイズできます。
# Reverse
reverse propを使ってタイムラインアイテムの向きを反対にすることができます。 これはデフォルトとdense モードの両方で動作します。
# Small
small propは、別のスタイルでユニークなデザインを提供することができます。
# Slots
# Icon
icon
スロットと v-avatar
を使用して、アバターをドットに挿入します。
# Opposite (反対)
opposite slotは、タイムライン内に、カスタマイズできる追加のレイヤーを提供します。
# タイムラインアイテムのデフォルト
v-timeline-item
の中に v-card
を置くと、カードの横に吹き出しが表示されます。
# その他
# 高度な使い方
モジュラーコンポーネントを使用すると、高度にカスタマイズされたソリューションを作成できます。
準備はできましたか?
Vuetifyのチームが選ぶ関連コンテンツで他の学習トピックに進むか、下のナビゲーション リンクでページ間を移動できます。
GitHub でこのページを編集する
最終更新日:10/07/2024, 11:31:37 AM