单击外部时关闭 reactstrap 模态

Question

我希望在单击外部模式时关闭模式，就像在示例中一样：https://reactstrap.github.io/components/modals/ 但它没有发生：

按下按钮，然后单击其他任何地方，但没有任何反应。我的代码中也会发生同样的情况。

我尝试添加 backdrop={true} 作为模态框的道具，但没有成功。

那么 reactstrap 在他们的示例中使用了什么？

Answer 1

您的依赖项中缺少 bootstrap：

"dependencies": {
    "react": "16.4.2",
    "react-dom": "16.4.2",
    "react-scripts": "1.1.4",
    "reactstrap": "6.4.0",
    "bootstrap": "4.1.1"
  },

如文档中所述：https://github.com/reactstrap/reactstrap#adding-bootstrap

我在此处修改了您的示例：https://codesandbox.io/s/m73w9j289

Answer 2

引用 shinzou 的话我也遇到过：

如果你设置backdrop={true} 你还必须设置toggle={fnToggle}否则它不会起作用。

单击外部时关闭 reactstrap 模态

Dismiss reactstrap modal when clicking outside of it

javascript

reactjs

reactstrap