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

* feat: switch visible to open for Popover

* feat: switch visible to open for Popconfirm

* fix

* chore: resolve conflict

* test: fix test case

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

772 B
Executable File

order title
3
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.

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;