跳到主要内容
版本:v7

ion-router-link

shadow

路由链接组件用于导航到指定链接。类似于浏览器的锚点标签,它可以接受用于定位的 href 属性和用于转场动画的方向参数。

备注

注意:该组件仅适用于纯 JavaScript 和 Stencil JavaScript 项目。对于 Angular 项目,请使用 <a> 标签和 Angular 路由器的 routerLink

更多信息请参阅 Router 文档。

属性

color

DescriptionThe color to use from your application's color palette. Default options are: "primary", "secondary", "tertiary", "success", "warning", "danger", "light", "medium", and "dark". For more information on colors, see theming.
Attributecolor
Type"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string | undefined
Defaultundefined

href

DescriptionContains a URL or a URL fragment that the hyperlink points to. If this property is set, an anchor tag will be rendered.
Attributehref
Typestring | undefined
Defaultundefined

rel

DescriptionSpecifies the relationship of the target object to the link object. The value is a space-separated list of link types.
Attributerel
Typestring | undefined
Defaultundefined

routerAnimation

DescriptionWhen using a router, it specifies the transition animation when navigating to another page using href.
Attributeundefined
Type((baseEl: any, opts?: any) => Animation) | undefined
Defaultundefined

routerDirection

DescriptionWhen using a router, it specifies the transition direction when navigating to another page using href.
Attributerouter-direction
Type"back" | "forward" | "root"
Default'forward'

target

DescriptionSpecifies where to display the linked URL. Only applies when an href is provided. Special keywords: "_blank", "_self", "_parent", "_top".
Attributetarget
Typestring | undefined
Defaultundefined

事件

No events available for this component.

方法

No public methods available for this component.

CSS Shadow Parts

No CSS shadow parts available for this component.

CSS 自定义属性

NameDescription
--backgroundBackground of the router link
--colorText color of the router link

插槽

No slots available for this component.