mirror of
https://github.com/ant-design/ant-design.git
synced 2025-08-06 16:06:28 +08:00
3ef3434052
* docs: add anchor for when-to-use section * Delete scripts/update-docs.js Signed-off-by: afc163 <afc163@gmail.com> --------- Signed-off-by: afc163 <afc163@gmail.com>
2.7 KiB
2.7 KiB
| category | group | title | subtitle | description | cover | coverDark | demo | ||
|---|---|---|---|---|---|---|---|---|---|
| Components | 数据展示 | Tooltip | 文字提示 | 简单的文字提示气泡框。 | https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*9LKlRbWytugAAAAAAAAAAAAADrJ8AQ/original | https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*bCbPTJ7LQngAAAAAAAAAAAAADrJ8AQ/original |
|
何时使用
鼠标移入则显示提示，移出消失，气泡浮层不承载复杂文本和操作。
可用来代替系统默认的 title 提示，提供一个 按钮/文字/操作 的文案解释。
代码演示
基本
位置
箭头展示
贴边偏移
自动调整位置
隐藏后销毁
多彩文字提示
_InternalPanelDoNotUseOrYouWillBeFired
Debug
禁用
禁用子元素
自定义子组件
API
通用属性参考：通用属性
| 参数 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| title | 提示文字 | ReactNode | () => ReactNode | - |
共同的 API
Semantic DOM
主题变量（Design Token）
FAQ
为何 Tooltip 的内容在关闭时不会更新？
Tooltip 默认在关闭时会缓存内容，以防止内容更新时出现闪烁：
// `title` 不会因为 `user` 置空而闪烁置空
<Tooltip open={user} title={user?.name} />
如果需要在关闭时也更新内容，可以设置 fresh 属性（例如 #44830 中的场景）：
<Tooltip open={user} title={user?.name} fresh />
