链接 Link

链接组件,用于页面跳转或外部链接。

何时使用

  • 需要在页面中添加可点击的链接时
  • 需要统一链接样式时
  • 需要区分不同类型链接(主要、次要、危险)时

示例

基础用法

最简单的用法,创建一个基本链接。

正在加载组件...
code

链接变种

支持主色和次色两种变种。

正在加载组件...
code

下划线样式

支持三种下划线显示方式:始终显示、悬停显示、从不显示。

正在加载组件...
code

危险链接

用于表示危险操作的链接,显示为红色。

正在加载组件...
code

新窗口打开

设置 target="_blank" 使链接在新窗口打开。

正在加载组件...
code

内联文本中的链接

链接可以嵌入到普通文本中使用。

正在加载组件...
code

所有变体展示

展示所有链接变体的组合效果。

正在加载组件...
code

API

参数说明类型默认值
variant链接变种'primary' | 'secondary''secondary'
underline下划线显示方式'always' | 'hover' | 'never''never'
danger是否为危险链接(红色)booleanfalse
href链接地址string-
target链接打开方式'_self' | '_blank' | '_parent' | '_top'-
children链接文本ReactNode-
className自定义类名string-