Реагирует: Bootstrap Модал не показывает - PullRequest
0 голосов
/ 15 апреля 2020

Я хотел бы открыть вертикально центрированный модал, как описано здесь https://react-bootstrap.github.io/components/modal/

Но я не хочу, чтобы он открывался при нажатии кнопки, которую я хотел бы открыть когда я открываю компонент

import React, { Component } from "react";

import { Modal } from "react-bootstrap";

import CustomButton from "../CustomButton/CustomButton";

export class Login extends Component {
    render()
    {
        return (
            <Modal
                size="lg"
                aria-labelledby="contained-modal-title-vcenter"
                centered
            >
                <Modal.Header>
                    <Modal.Title id="contained-modal-title-vcenter">
                        Login
                    </Modal.Title>
                </Modal.Header>
                <Modal.Body>
                    <h4>Centered Modal</h4>
                    <p>
                        Cras mattis consectetur purus sit amet fermentum. Cras justo odio,
                        dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac
                        consectetur ac, vestibulum at eros.
                    </p>
                </Modal.Body>
                <Modal.Footer>
                    <CustomButton>Close</CustomButton>
                </Modal.Footer>
            </Modal>
        );
    }
}

export default Login;

Спасибо, ребята

1 Ответ

0 голосов
/ 15 апреля 2020

Вам необходимо передать show реквизит <Modal>. Обычно это контролируется состоянием родителя, поэтому это будет выглядеть примерно так -

render() {
  const { showModal } = this.props; // usually comes from parent

  return (
    <Modal show={showModal} ...
  )
}
...