javascript - 在某些情况下无法关闭反应模式

Question

您好，我想在满足条件时关闭模态(this.chooseRounds > 0 && this.state.rounds == this.state.roundsValue)，但我无法关闭，我不知道为什么。我花了更多时间来解决这个问题，这是一个代码：

let modalShow;
    if(this.chooseRounds > 0 && this.state.rounds == this.state.roundsValue) {
        modalShow = (
            <ReactModal
                isOpen={true}
                contentLabel="Minimal Modal Example"
                ariaHideApp={false}
            >
                <button onClick={this.handleModal}>Close Modal</button>
            </ReactModal>
        );
    }else {
        modalShow = (
            <ReactModal
                isOpen={false}
                contentLabel="Minimal Modal Example"
                ariaHideApp={false}
            >
                <button onClick={this.handleModal}>Close Modal</button>
            </ReactModal>
        )
    }

在状态下我有showModal: false, handleModal函数里面有this.setState({ showModal: !this.state.showModal });

标签： javascriptreactjsreact-modal

Answer 1

您需要使用您的 showModal 状态并将其放入 isOpen 道具中

 const { showModal } = this.state
<ReactModal
  isOpen={showModal}
  contentLabel="Minimal Modal Example"
  ariaHideApp={false}
>
  <button onClick={this.handleModal}>Close Modal</button>
</ReactModal>