“Warning: react-modal: App element is not defined. Please use `Modal.setAppElement(el)` or set `appElement={el}`”

Question

How to fix this warning in console of a React app using the react-modal package:

Warning: react-modal: App element is not defined. Please use Moda

Answer 1

This is my TypeScript Modal component which wraps react-modal v3.8.1:

import React from 'react'
import ReactModal from 'react-modal'

interface Props {
  isOpen: boolean
  ariaLabel?: string
}

const Modal: React.FC = ({
  children,
  ariaLabel = 'Alert Modal',
  isOpen,
}) => (
  
    {children}
  
)

export default Modal

Usage in component with state = { isOpen: true }:

  

    Modal Content here…
  
   { this.setState({ isOpen: false }) }}>Okay