Link 超链接

该组件为超链接组件,在不同平台有不同表现形式:
- 在APP平台会通过 plus 环境打开内置浏览器
- 在小程序中把链接复制到粘贴板,同时提示信息
- 在H5中通过 window.open 打开链接
平台差异说明
| APP | H5 | 微信小程序 | 支付宝小程序 | QQ小程序 | ··· |
|---|---|---|---|---|---|
| √ | √ | √ | √ | √ | 适配中 |
代码示例
部分功能示例,具体可参考示例程序以及文档API。
基础用法
通过 href 设置打开的链接,slot 传入显示的内容
html
<!-- 文字内容通过slot传入 -->
<fu-link href="https://www.baidu.com">百度一下</fu-link>
<!-- 文字内容通过text传入 -->
<fu-link href="https://www.baidu.com" text="百度一下"></fu-link>注:之所以增加 props 传入,是因为 slot 传入在 nvue 中无法控制文字的样式
下划线
通过 underline 设置是否显示下划线
html
<fu-link href="https://www.baidu.com" text="百度一下" underline></fu-link>API
Link Props
| 属性名 | 说明 | 类型 | 默认值 | 可选值 |
|---|---|---|---|---|
| color | 文字颜色 | String|Number | - | - |
| size | 文字大小 | String | 14 | - |
| underLine | 是否显示下划线 | Boolean | false | true |
| href | 打开的链接,要带上http(s) | String | - | - |
| mpTips | 各个小程序平台把链接复制到粘贴板后的提示语 | String | 链接已复制,请在浏览器打开 | - |
| text | 显示的文字内容 | String | - | - |
| customClass | 定义需要用到的外部类 | String | - | - |
| customStyle | 定义需要用到的外部样式 | Object|String | - | - |
Link Events
| 事件名 | 说明 | 回调参数 |
|---|---|---|
| click | 点击触发事件 | () => void |
Link Slots
| 插槽名 | 说明 |
|---|---|
| default | 显示的文字内容 |