Остановить закрытие модального окна при внешнем клике в React - PullRequest
Новая
       89

Остановить закрытие модального окна при внешнем клике в React

0 голосов
/ 04 августа 2020

Я использую react- bootstrap для модального компонента.

Вот мой код импорта. 


import React from "react";
import Modal from "react-bootstrap/Modal";
import ModalBody from "react-bootstrap/ModalBody";
import 'bootstrap/dist/css/bootstrap.css';

Текущее поведение модального окна - это когда кто-то щелкает за пределами модального- содержание. Он автоматически закрывается. Я хочу остановить такое поведение. Я пробовал использовать несколько способов, которые были предложены в сообщениях о переполнении стека, но не смог этого сделать.

Модальный код 


<Modal data-backdrop="static" shouldCloseOnOverlayClick={false} data-keyboard="false" show={this.state.modalIsOpen} onHide={this.toggleModal} id={this.props.modalId} centered>
        <ModalBody style={style}>
            <h3 className="heading color-white">Please Wait</h3>
            <CustomLoader />

        </ModalBody>
      </Modal>

1 Ответ

2 голосов
/ 04 августа 2020

Ваши реквизиты для модального окна неверны. У модального компонента есть свойство backdrop = "stati c" для изменения поведения при нажатии на фон: 

<Modal
    show={show}
    onHide={handleClose}
    backdrop="static"
    keyboard={false}>
</Modal>
...