react bootstrap 模态 - 我如何让它显示？

Question

我有一个正在导入 reactBootstrap 的组件：

import ReactBootstrap from 'react-bootstrap'

然后我的组件中有一个函数会在用户单击按钮时触发：

onClickBtn : function() {
  var Modal = ReactBootstrap.Modal;
  return (
    <Modal>
      ... 
    </Modal>
  )
}

但是，我收到错误消息：

Uncaught TypeError : Cannot read property 'Modal' of undefined.

我在遵循 react-bootstrap 指南时遇到问题，我想知道是否有人知道如何轻松导入模态。谢谢

Answer 1

您可以使用以下 es6 语法直接从 'react-bootstrap' 导入任何组件：

import { Component } from 'react-bootstrap';

在这种特殊情况下，您可以使用：

import { Modal } from 'react-bootstrap';

您也可以一次导入多个组件，例如：

import { Button, ButtonToolbar, Modal } from 'react-bootstrap';

需要 { } 是因为这些不是默认导出，它们是可以通过名称引用的命名导出。

react bootstrap modal - how do I get it to show?