react-bootstrap: Modal not working

I am trying to get a modal to popup when Login is clicked but nothing populates.

Im using the ‘react-bootstrap’ library.

Here is the code:

var React  = require('react');
var Modal = require('react-bootstrap');

var Login = React.createClass({
  render: function() {
    return (
    <div className='static-modal'>
        <Modal title='Modal title'
          enforceFocus={false}
          backdrop={false}
          animation={false}
          container={mountNode}
          onRequestHide={function() {}}>
          <div className='modal-body'>
            One fine body...
          </div>
          <div className='modal-footer'>
            <Button>Close</Button>
            <Button bsStyle='primary'>Save changes</Button>
          </div>
        </Modal>
      </div>
    );
  }
});


module.exports = Login;

Any idea why it’s not rendering? What does MountNode have to be passed as?

FYI, I am also using react router to route thru the components.

About this issue

  • Original URL
  • State: closed
  • Created 9 years ago
  • Comments: 29 (15 by maintainers)

Most upvoted comments

Yea, still getting same error unfortunately…

On Mon, Jun 22, 2015 at 12:16 AM, Jason Quense notifications@github.com wrote:

it doesn’t look like you imported the Modal component in your example. that cryptic error is React saying some Component actually wasn’t defined. you need to do var Modal = ReactBootstrap.Modal as well

— Reply to this email directly or view it on GitHub https://github.com/react-bootstrap/react-bootstrap/issues/876#issuecomment-113996873 .