链接

一个用于展示文本是链接的组件。

属性

名称	类型	默认值	说明
hoverClass	String	pure-hover	指定按下去的样式类
text	String	-	链接文本
theme	String	-	[详情] 链接主题
beforeIconName	String	-	前置图标名称
beforeIconMode	String	-	[参考] 前置图标图片的裁剪、缩放模式
afterIconName	String	-	后置图标名称
afterIconMode	String	-	[参考] 后置图标图片的裁剪、缩放模式
disabled	Boolean	false	禁用状态
bold	Boolean	false	是否加粗
underline	Boolean	false	是否显示下划线
fontSize	String	-	字体大小
color	String	-	字体颜色
fontWeight	String	-	字体粗细
lineColor	String	-	下划线颜色
lineWidth	String	-	下划线宽度
lineHeight	String	-	下划线高度
lineRadius	String	-	下划线圆角大小
lineBottom	String	-	下划线底部距离
disabledColor	String	-	禁用状态字体颜色
disabledOpacity	Number	0.5	禁用状态字体透明度

主题

通过 theme 属性来设置链接主题，主题分为内置主题和自定义扩展主题。

内置主题

直接将 theme 属性设置为内置主题名称即可使用，如 theme="primary"。

主题名称	说明
primary	主要链接
success	成功链接
warning	警告链接
danger	危险链接
info	信息链接

扩展主题

1. 首先在 css 中定义好主题变量名。
2. 直接将变量名赋值给 theme 属性即可使用，如 theme="--my-custom-link-theme-1"。

vue

<!-- 扩展主题 -->
<pure-link text="扩展主题" theme="--my-custom-link-theme-1" />

css

/* 定义扩展主题变量 */
page {
	--my-custom-link-theme-1: #ff9900;
}

事件

名称	参数	说明
@onClick	-	点击时触发

插槽

名称	参数	说明
#default	-	默认，链接内容