文字提示 Tooltip
悬浮提示,展现需要关注的信息
基本使用
我是提示内容
Show Code
vue
<template>
<n-tooltip :maxWidth="240">
<template #title>我是提示内容</template>
<n-button type="primary">悬浮</n-button>
</n-tooltip>
</template>自定义样式
我是提示内容,我是提示内容,我是提示内容,我是提示内容
Show Code
vue
<template>
<n-tooltip :maxWidth="300" :fontSize="16" color="rgba(0, 0, 0, 0.85)" backgroundColor="#FFF">
<template #title>我是提示内容,我是提示内容,我是提示内容,我是提示内容</template>
<n-button type="primary">悬浮</n-button>
</n-tooltip>
</template>API
| 参数 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| maxWidth | 提示框内容最大宽度,单位px | number | 120 |
| content | 展示的文本 | string | '暂无内容' |
| title | 提示的文本 | string | '暂无提示' |
| fontSize | 提示文本字体大小,单位px | number | 14 |
| color | 提示文本字体颜色 | string | '#FFF' |
| backgroundColor | 提示框背景色 | string | 'rgba(0,0,0,.85)' |