react-modal-bootstrap16

React v16 fix for react modal bootstrap

Install

npm install --save react-modal-bootstrap16

Usage

import React, { Component } from 'react'

import {Modal, ModalBody, ModalClose, ModalFooter, ModalHeader, ModalTitle} from 'react-modal-bootstrap16'

export default class App extends Component {
  // eslint-disable-next-line no-useless-constructor
  constructor(props) {
    super(props)
    this.state = {isOpen: true}
    this.hideModal = this.hideModal.bind(this)
  }

  hideModal() {
    this.setState({isOpen: false})
  }
  render () {
    return (
      <div>
        <Modal isOpen={this.state.isOpen} onRequestHide={this.hideModal}>
          <ModalHeader>
            <ModalTitle>Modal title</ModalTitle>
            <ModalClose onClick={this.hideModal}/>
          </ModalHeader>
          <ModalBody>
            <p>Ab ea ipsam iure perferendis! Ad debitis dolore excepturi
              explicabo hic incidunt placeat quasi repellendus soluta,
              vero. Autem delectus est laborum minus modi molestias
              natus provident, quidem rerum sint, voluptas!</p>
          </ModalBody>
          <ModalFooter>
            <button className='btn btn-default' onClick={this.hideModal}>
              Close
            </button>
            <button className='btn btn-primary' onClick={() => {
              setTimeout(() => {
                this.hideModal()
              }, 2000)
            }}>
              Save changes
            </button>
          </ModalFooter>
        </Modal>
      </div>
    )
  }
}

License

MIT © BeyhanEsen