Modal

A basic way to present content above an enclosing view. Modals may be nested within other Modals.

import { Modal } from 'react-native';

<Modal {...props}>{children}</Modal>;

API

Props

animationType ?("fade" | "none" | "slide")

Default is "none". This can be used to add an animation to the modal being opened or closed.

children ?any

The children of a Modal element will be hidden or shown depending on the modal visibility.

onDismiss ?() => void

Called after the modal has been dismissed and is no longer visible.

onRequestClose ?() => void

Called when the user is attempting to close the modal like when they hit Escape. Only the top-most Modal responds to hitting Escape.

onShow ?() => void

Called after the modal has been shown and may be visible.

transparent ?boolean = false

Determines if the modal is rendered with a transparent backdrop or a white backdrop

visible ?boolean = true

Determines if the modal and its content is rendered.


Examples

Updated
Edit
React Native for WebCopyright © Nicolas Gallagher and Meta Platforms, Inc.