2020-08-13 11:47:56 +08:00
|
|
|
|
# Link <small>链接</small>
|
|
|
|
|
|
|
|
|
|
|
|
## 示例
|
|
|
|
|
|
|
|
|
|
|
|
[[ demo src="/demo/link/default.vue"]]
|
|
|
|
|
|
|
|
|
|
|
|
## API
|
|
|
|
|
|
|
|
|
|
|
|
### 属性
|
|
|
|
|
|
|
|
|
|
|
|
| 名称 | 类型 | 默认值 | 描述 |
|
|
|
|
|
|
| -- | -- | -- | -- |
|
2021-10-20 01:11:27 +08:00
|
|
|
|
| ``ui`` | `string=` | - | [^ui] |
|
|
|
|
|
|
| ``to`` | `string | Object` | - | 链接路径。当配合 Vue Router 使用时，会透传到 [`<router-link>`](https://router.vuejs.org/zh/api/#router-link) 的[同名属性](https://router.vuejs.org/zh/api/#to)；否则只支持 `string` 类型，输出到 `<a>` 元素的 `href` 属性中。 |
|
|
|
|
|
|
| ``rel`` | `string` | - | HTML 原生的链接类型，可参考 [MDN 的相关介绍](https://developer.mozilla.org/zh-CN/docs/Web/HTML/Link_types)。 |
|
|
|
|
|
|
| ``target`` | `string` | - | [^target] |
|
|
|
|
|
|
| ``native`` | `boolean` | `false` | 是否强制使用原生的 `<a>` 元素。 |
|
|
|
|
|
|
| ``fallback`` | `string` | `'span'` | 在 [`to`](#props-to) 属性为空时使用的原生元素类型。 |
|
|
|
|
|
|
| ``disabled`` | `boolean=` | `false` | 是否为禁用状态。 |
|
2020-08-13 11:47:56 +08:00
|
|
|
|
|
|
|
|
|
|
^^^ui
|
|
|
|
|
|
预设样式。
|
|
|
|
|
|
|
|
|
|
|
|
+++枚举值
|
|
|
|
|
|
| 值 | 描述 |
|
|
|
|
|
|
| -- | -- |
|
|
|
|
|
|
| `strong` | 加强样式。 |
|
|
|
|
|
|
| `s` | 小尺寸样式。 |
|
|
|
|
|
|
| `m` | 中尺寸样式。 |
|
|
|
|
|
|
+++
|
|
|
|
|
|
^^^
|
|
|
|
|
|
|
|
|
|
|
|
^^^target
|
|
|
|
|
|
指定在何处显示链接的资源，可参考 [MDN 的相关介绍](https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/a#attr-target)。
|
|
|
|
|
|
|
|
|
|
|
|
:::tip
|
|
|
|
|
|
当 `target` 为 `_blank` 时将自动增加 `noopener` 值（如果用户未指定该值）以增强默认情况下的安全性。
|
|
|
|
|
|
:::
|
|
|
|
|
|
^^^
|
|
|
|
|
|
|
|
|
|
|
|
### 插槽
|
|
|
|
|
|
|
|
|
|
|
|
| 名称 | 描述 |
|
|
|
|
|
|
| -- | -- |
|
2021-10-20 01:11:27 +08:00
|
|
|
|
| ``default`` | 链接内容。 |
|
2020-08-13 11:47:56 +08:00
|
|
|
|
|
|
|
|
|
|
### 事件
|
|
|
|
|
|
|
|
|
|
|
|
| 名称 | 描述 |
|
|
|
|
|
|
| -- | -- |
|
2021-10-20 01:11:27 +08:00
|
|
|
|
| ``click`` | 在 [`to`](#props-to) 属性为空或指定了 `native` 为 `true` 的情况下，点击时触发。回调参数为 `(event)`，`event` 类型为原生 [`Event`](https://developer.mozilla.org/zh-CN/docs/Web/Events/click)。 |
|
2021-10-28 15:51:45 +08:00
|
|
|
|
|
|
|
|
|
|
### 全局配置
|
|
|
|
|
|
|
|
|
|
|
|
| 名称 | 类型 | 默认值 | 描述 |
|
|
|
|
|
|
| -- | -- | -- | -- |
|
2021-10-29 17:13:10 +08:00
|
|
|
|
| ``link.routerLink`` | `string` | `'router-link'` | 在路由模式下使用的链接组件名称，用于在 Nuxt.js 等环境下更换为兼容 Vue Router 的实现。 |
|
