メインコンテンツにスキップ
バージョン: v8

ion-breadcrumb

シャドウ

パンくずリストは、パンくずリストコンポーネントの子である単一のナビゲーションアイテムです。パンくずリストはアプリ内の別の場所にリンクしたり、プレーンテキストにしたりできます。各パンくずリストには、次のパンくずリストとの間に区切り記号があり、オプションでアイコンを含めることができます。

詳細については、パンくずリストのドキュメントを参照してください。

インターフェース​

interface BreadcrumbCollapsedClickEventDetail {
  collapsedBreadcrumbs?: HTMLIonBreadcrumbElement[];
}

必須ではありませんが、このインターフェースは、より強力な型付けのためにCustomEventインターフェースの代わりに使用できます。

interface BreadcrumbCustomEvent extends CustomEvent {
  detail: BreadcrumbCollapsedClickEventDetail;
  target: HTMLIonBreadcrumbElement;
}

プロパティ​

active​

説明trueの場合、パンくずリストは、現在アクティブなパンくずリストであることを示すために、異なる外観になります。いずれにも設定されていない場合、最後のパンくずリストではデフォルトでtrueになります。
属性active
型boolean
デフォルトfalse

color​

説明アプリケーションのカラーパレットで使用する色。デフォルトのオプションは、"primary"、"secondary"、"tertiary"、"success"、"warning"、"danger"、"light"、"medium"、および"dark"です。色の詳細については、テーマ設定を参照してください。
属性color
型"danger"｜"dark"｜"light"｜"medium"｜"primary"｜"secondary"｜"success"｜"tertiary"｜"warning"｜string｜undefined
デフォルトundefined

disabled​

説明trueの場合、ユーザーはパンくずリストを操作できません。
属性disabled
型boolean
デフォルトfalse

download​

説明この属性は、ブラウザにURLに移動する代わりにダウンロードするように指示するため、ユーザーはローカルファイルとして保存するように求められます。属性に値がある場合、[保存]プロンプトで事前に入力されたファイル名として使用されます（ユーザーは必要に応じてファイル名を変更できます）。
属性download
型string｜undefined
デフォルトundefined

href​

説明ハイパーリンクが指すURLまたはURLフラグメントが含まれています。このプロパティが設定されている場合、アンカータグが表示されます。
属性href
型string｜undefined
デフォルトundefined

mode​

説明モードは、使用するプラットフォームスタイルを決定します。
属性mode
型"ios"｜"md"
デフォルトundefined

rel​

説明ターゲットオブジェクトとリンクオブジェクトの関係を指定します。値は、リンクタイプのスペースで区切られたリストです。
属性rel
型string｜undefined
デフォルトundefined

routerAnimation​

説明ルーターを使用する場合、hrefを使用して別のページに移動するときに、遷移アニメーションを指定します。
属性undefined
型((baseEl: any, opts?: any) => Animation)｜undefined
デフォルトundefined

routerDirection​

説明ルーターを使用する場合、hrefを使用して別のページに移動するときに、遷移方向を指定します。
属性router-direction
型"back"｜"forward"｜"root"
デフォルト'forward'

separator​

説明trueの場合、このパンくずリストと次のパンくずリストの間に区切り記号を表示します。最後のものを除き、すべてのパンくずリストのデフォルトはtrueです。
属性separator
型boolean｜undefined
デフォルトundefined

target​

説明リンクされたURLを表示する場所を指定します。hrefが指定されている場合にのみ適用されます。特別なキーワード："_blank"、"_self"、"_parent"、"_top"。
属性target
型string｜undefined
デフォルトundefined

イベント​

名前説明バブル
ionBlurパンくずリストがフォーカスを失ったときに発生します。true
ionFocusパンくずリストにフォーカスがあるときに発生します。true

メソッド​

このコンポーネントで利用できるパブリックメソッドはありません。

CSSシャドウパーツ​

名前説明
collapsed-indicatorパンくずリストが折りたたまれていることを示すインジケーター要素。
nativeすべての子要素をラップするネイティブHTMLアンカーまたはdiv要素。
separator各パンくずリスト間の区切り記号要素。

CSSカスタムプロパティ​

名前説明
--background-focusedフォーカスされたときのパンくずリストの背景色
--colorパンくずリストのテキストの色
--color-activeアクティブなパンくずリストのテキストの色
--color-focusedフォーカスされたときのパンくずリストのテキストの色
--color-hoverホバー時のパンくずリストのテキストの色

スロット​

このコンポーネントで利用できるスロットはありません。

目次

このページを編集