ant-design/components/popover/demo/control.md
yykoypj 6b658dab76
feat: switch visible to open for Tooltip (#37241)
* feat: switch visible to open for Tooltip & Popover & Popconfirm

* fix lint

* fix: merge state

* chore: Update ts part

* test: add legacy test

* test: fix test case

Co-authored-by: 二货机器人 <smith3816@gmail.com>
2022-08-26 17:17:13 +08:00

46 lines
772 B
Markdown
Executable File

---
order: 3
title:
zh-CN: 从浮层内关闭
en-US: Controlling the close of the dialog
---
## zh-CN
使用 `open` 属性控制浮层显示。
## en-US
Use `open` prop to control the display of the card.
```tsx
import { Button, Popover } from 'antd';
import React, { useState } from 'react';
const App: React.FC = () => {
const [open, setOpen] = useState(false);
const hide = () => {
setOpen(false);
};
const handleOpenChange = (newOpen: boolean) => {
setOpen(newOpen);
};
return (
<Popover
content={<a onClick={hide}>Close</a>}
title="Title"
trigger="click"
open={open}
onOpenChange={handleOpenChange}
>
<Button type="primary">Click me</Button>
</Popover>
);
};
export default App;
```