Question

我已经在模态对话框中使用了react-modal，

在我的reactjs render（）中，我具有以下模式

return(
        <ReactModal
        isOpen={this.state.showModal}
        contentLabel="Minimal Modal Example">
        <button style={styleClose} onClick={this.handleCloseModal}>
      CloseModal</button>
        {items}
     </ReactModal>
    )

但是当打开此对话框时，后面的项目是重叠的，我如何才能仅显示对话框而不显示背景元素？

重叠的元素是具有单选按钮的组件。普通文本不重叠。如何使这些按钮不重叠？

我尝试设置zIndex并应用样式，但这不起作用。

当我也单击键盘上的esc时，我怎么能关闭？

Answer 1

您的问题的第一部分需要更多信息来阐明，我可以回答第二部分：

将此添加到您的模式元素中： shouldCloseOnEsc={true}

如果还没有，请记住还要添加onRequestClose={<your component method that hides the modal}

检查此链接以了解更多用法：http://reactcommunity.org/react-modal/#usage

reactjs中的React Modal

1 个答案: