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

ion-router-link

shadow

The router link component is used for navigating to a specified link. Similar to the browser's anchor tag, it can accept a href for the location, and a direction for the transition animation.

注記

Note: this component should only be used with vanilla and Stencil JavaScript projects. For Angular projects, use an <a> and routerLink with the Angular router.

See the Router documentation for more information.

Properties​

color​

Descriptionアプリケーションのカラーパレットから使用する色を指定します。デフォルトのオプションは以下の通りです。 "primary", "secondary", "tertiary", "success", "warning", "danger", "light", "medium", と "dark" です.色に関する詳しい情報は theming を参照してください。
Attributecolor
Type"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string | undefined
Defaultundefined

href​

Descriptionハイパーリンクが指し示す URL または URL フラグメントを格納します。このプロパティが設定されている場合、アンカータグがレンダリングされます。
Attributehref
Typestring | undefined
Defaultundefined

rel​

Descriptionターゲットオブジェクトとリンクオブジェクトの関係を指定します。値は、スペースで区切られたリンクタイプのリストです。
Attributerel
Typestring | undefined
Defaultundefined

routerAnimation​

Descriptionルータを使用する場合、hrefを使用して別のページに移動する際の遷移アニメーションを指定します。
Attributerouter-animation
Type((baseEl: any, opts?: any) => Animation) | undefined
Defaultundefined

routerDirection​

Descriptionルータを使用する場合、hrefを使用して他のページに移動する際の遷移方向を指定します。
Attributerouter-direction
Type"back" | "forward" | "root"
Default'forward'

target​

Descriptionリンク先のURLを表示する場所を指定します。hrefを指定した場合のみ適用される。特別なキーワードがあります。"_blank", "_self", "_parent", "_top".
Attributetarget
Typestring | undefined
Defaultundefined

Events​

No events available for this component.

Methods​

No public methods available for this component.

CSS Shadow Parts​

No CSS shadow parts available for this component.

CSS Custom Properties​

NameDescription
--backgroundルーターリンクの背景
--colorルーターリンクの文字色

Slots​

No slots available for this component.