2016-08-26 14:42:41 +08:00
|
|
|
---
|
|
|
|
|
category: Components
|
2016-11-09 14:43:32 +08:00
|
|
|
type: Data Display
|
2016-09-21 11:28:38 +08:00
|
|
|
title: Popover
|
2020-06-05 13:50:09 +08:00
|
|
|
cover: https://gw.alipayobjects.com/zos/alicdn/1PNL1p_cO/Popover.svg
|
2016-08-26 14:42:41 +08:00
|
|
|
---
|
|
|
|
|
|
|
|
|
|
The floating card popped by clicking or hovering.
|
|
|
|
|
|
2016-09-10 13:43:30 +08:00
|
|
|
## When To Use
|
2016-08-26 14:42:41 +08:00
|
|
|
|
2016-08-26 15:07:46 +08:00
|
|
|
A simple popup menu to provide extra information or operations.
|
2016-08-26 14:42:41 +08:00
|
|
|
|
|
|
|
|
Comparing with `Tooltip`, besides information `Popover` card can also provide action elements like links and buttons.
|
|
|
|
|
|
|
|
|
|
## API
|
|
|
|
|
|
2020-07-02 09:52:28 +08:00
|
|
|
| Param | Description | Type | Default value | Version |
|
|
|
|
|
| ------- | ------------------- | -------------------------------------- | ------------- | ------- |
|
|
|
|
|
| content | Content of the card | string \| ReactNode \| () => ReactNode | - | |
|
|
|
|
|
| title | Title of the card | string \| ReactNode \| () => ReactNode | - | |
|
2016-12-22 12:00:57 +08:00
|
|
|
|
2020-04-17 17:56:42 +08:00
|
|
|
Consult [Tooltip's documentation](/components/tooltip/#API) to find more APIs.
|
2017-01-22 14:26:46 +08:00
|
|
|
|
|
|
|
|
## Note
|
|
|
|
|
|
2017-09-16 11:26:22 +08:00
|
|
|
Please ensure that the child node of `Popover` accepts `onMouseEnter`, `onMouseLeave`, `onFocus`, `onClick` events.
|
