Tooltip 提示
Tooltip 提示组件用于在用户鼠标悬停时,显示提示信息。
参数
Props
名称 | 类型 | 默认值 | 描述 |
---|---|---|---|
content | string | '' | 提示内容 |
inverse | boolean | false | 是否反转颜色 |
showDelay | number | 200 | 移入延迟时间(ms) |
hideDelay | number | 0 | 移出延迟时间(ms) |
enterable | boolean | false | 是否可以移入弹窗 |
placement | PlacementType | 'top' | 弹出位置 |
offset | number | - | 弹出偏移量 |
showArrow | boolean | - | 是否显示箭头 |
disabled | boolean | - | 是否禁用 |
Slots
名称 | 描述 | 参数 |
---|---|---|
default | 默认插槽,触发提示的元素 | - |
示例
基础用法
不同位置
反转颜色
延迟显示/隐藏
可进入提示框
多行文本
TypeScript
ts
// 弹出位置类型
export type PlacementType =
| 'top'
| 'top-start'
| 'top-end'
| 'bottom'
| 'bottom-start'
| 'bottom-end'
| 'left'
| 'left-start'
| 'left-end'
| 'right'
| 'right-start'
| 'right-end';