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