React Popup Opening closing the popup Example

Use the popup to render any content or form in a modal box that can be programmatically shown or hidden. For that the isOpen option can be used.

To check whether the popup is opened or not, use the isVisible method.

Get started with this example

Javascript jQuery Angular React Vue

                    jsxconst [isPopupOpen, setPopupOpen] = useState(false);
                        
<Button onClick={() => setPopupOpen(true)}>
  Open popup
</Button>

<Popup 
  display="center" 
  isOpen={isPopupOpen} 
  onClose={() => setPopupOpen(false)}
>
  <!-- popup content -->
  <Button onClick={() => setPopupOpen(false)}>
    Close
  </Button>
</Popup>

                