Link 链接

超链接组件，支持路由导航、样式变体、禁用状态以及外部链接处理。

基于 BrConfigProvider 实现全局主题配置，支持普通链接/路由链接双模式。

基础用法

Normal LinkRouter Link (Vue Router)

Example

变体与尺寸

支持 default, primary, secondary, ghost, underline 等多种变体。

DefaultPrimarySecondaryUnderlineGhost

Example

支持 xs, sm, md, lg, xl, 2xl 等多种尺寸。

Link (xs)Link (sm)Link (md)Link (lg)Link (xl)Link (2xl)

Ghost (xs)Ghost (sm)Ghost (md)Ghost (lg)Ghost (xl)Ghost (2xl)

Example

带图标

可以通过 prefix 和 suffix 插槽添加图标。

With Prefix Icon With Suffix Icon

Example

状态与外部链接

支持禁用状态。外部链接（以 http 或 // 开头）会自动添加 target="_blank" 和 rel="noopener noreferrer"。

Disabled Link External Link (Auto target="_blank")

Example

全局尺寸配置

通过 BrConfigProvider 可以配置组件的默认尺寸。

Global Size:xssmmdlgxl2xl

Link 1Link 2Link 3

Example

主题定制

通过 BrConfigProvider 全局配置主题色。

Custom PrimaryCustom SecondaryCustom Ghost

Example

API

Props

名称	类型	默认值	说明
variant	string	'default'	样式变体：default, primary, secondary, ghost, underline
size	string	'md'	尺寸：sm, md, lg
href	string	-	原生链接地址
to	string | object	-	路由目标（需配合 vue-router）
disabled	boolean	false	是否禁用
target	string	-	链接打开方式
rel	string	-	链接关系属性
as	string | object	-	渲染的标签或组件

Slots

名称	说明
default	链接内容
prefix	前置内容（如图标）
suffix	后置内容（如图标）