mdbreact modal применяет класс 'modal-open' к тегу body, даже если модальный еще не открыт

Question

Я использую модал mdbreact в моем приложении реакции, но столкнулся с некоторой проблемой.Я пытаюсь включить модальный компонент на своей странице, но модальный еще не открыт, несмотря на то, что он применяет класс 'modal-open' к тегу body, который останавливает прокрутку тела.

Мой кодвыглядит следующим образом:

import React, { Component } from 'react';
import { Modal, ModalBody, ModalHeader, ModalFooter } from 'mdbreact';

class GroupContainer extends Component {
    constructor() {
        super();
        this.state = {
            modal: false,
        }
    }

    renderModal = () => {
        this.setState({
            modal: true,
        })
    }

    closeModal = () => {
        this.setstate({
            modal: false,
        })
    }

    render() { 
        return (
        <div>
             <Modal isOpen={this.state.modal} toggle={() => this.renderModal()} fullHeight position="bottom">
              test
            </Modal>

        </div>
        )
    }
};


export default GroupContainer;

Состояние 'модальное' ложно, но класс модального открытия применяется.Он должен применяться только тогда, когда состояние истинно.Я сделаю состояние как истинное при нажатии внешней кнопки, чтобы показать этот модал.Любая подсказка?

Answer 1

Каждый из импортируемых файлов - это MDB (имя) и MDBModal, MDBModalBody.Также для переключения вам не нужны две функции, потому что ваш код запутается.Пример модального переключателя

toggle = () => {
  this.setState({
    modal: !this.state.modal
  })
}

//for multiple modals
//modal1
//modal2
//modal3

toggle = nr => () => {
  let modalNumber = 'modal' + nr;
  this.setState({
    [modalNumber]: !this.state[modalNumber]
  })
}