如何在反应模式中禁用背景并关闭先前打开的模式

Posted 2023-03-07

【中文标题】如何在反应模式中禁用背景并关闭先前打开的模式

【英文标题】：How to disable backdrop and close previous open modal in react-modal

【发布时间】：2018-11-17 01:41:51

【问题描述】：

我正在使用react-modal component，

在某些情况下我不需要背景，如何禁用背景。在文档中看不到任何属性。 无论何时打开新的模态，我如何关闭任何以前的模态。

【参考方案1】：

1) 如果您不需要背景，您可以随时将 style 属性传递给 react-modal：

style=overlay:backgroundColor:"rgba(0,0,0,0)"

看一下代码，默认样式叠加层有一个 backgroundColor rgba(255, 255, 255, 0.75)。

2) 如果您想在打开新的模态框时关闭其他模态框，您只需更改 isOpen 属性的值即可：

isOpen=this.state.showModalOne

当你打开 ModalTwo 时，你会调用：

this.setState(showModalOne:false, showModalTwo:true);

如果模态框位于不同的组件中，您可以使用道具。 您甚至可以选择不关闭模式，而只更改其内容。