Реагировать самозагрузки модального ES6

Question

Привет я нужна помощь отображения начальной загрузки модального

import React from 'react'; 
    import styles from '../App.css'; 
    import styles from '../../../public/css/app.css'; 

    import Button from 'react-bootstrap/lib/Button'; 
    import Modal from 'react-bootstrap/lib/Modal'; 


    export default class Edit extends React.Component { 
     constructor(props) { 
    super(props); 

    console.log(props) 

    this.state= { showModal: false }; 

    this.state = {showModal:true}; 
    this.open = this.open.bind(this); 
    this.close = this.close.bind(this); 
    } 


    close() { 
     this.setState({ showModal: false }); 
    } 

    open() { 
     alert("open modal") 
     this.setState({ showModal: true }); 
    } 


    render() { 

     return (
     <div> 
     <p>Click to get the full Modal experience!</p> 

     <Button 
      bsStyle="primary" 
      bsSize="large" 
      onClick={this.open.bind(this)} 
     > 
      Launch demo modal 
     </Button> 

     <Modal show={this.state.showModal} onHide={this.close}> 
      <Modal.Header closeButton> 
      <Modal.Title>Modal heading</Modal.Title> 
      </Modal.Header> 
      <Modal.Body> 
      <h4>Text in a modal</h4> 
      <p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula.</p> 

      <hr /> 

      <h4>Overflowing text to show scroll behavior </h4> 
      <p>Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.</p> 
      </Modal.Body> 
      <Modal.Footer> 
      <Button onClick={this.close}>Close</Button> 
      </Modal.Footer> 
     </Modal> 
     </div> 

    ); 
    } 
    } 

Модальные не показывают какие-либо предложения?

Я последовал за этим документом и рассмотрел рекомендацию по бутстрапу и рекомендацию babel es6.

Answer 1

Если вы в конечном итоге снова хочет самозагрузки в вашем среагировать приложения, просто используйте reactstraphttp://reactstrap.github.io/components/modals/

Answer 2

Чтобы избежать избыточности, вам не нужно ставить «привязку (это)» в этой части кода:

<Button 
     bsStyle="primary" 
     bsSize="large" 
     onClick={this.open.bind(this)} 
> 

Как вы уже сказали, вы уже указали 'bind (this)' на другой части кода (сверху, внутри конструктора).