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

Javascript 在某些情况下无法关闭反应模式,javascript,reactjs,react-modal,Javascript,Reactjs,React Modal,您好,我希望在满足条件时关闭模式(this.chooseRounds>0&&this.state.rounds==this.state.roundsValue),但我无法关闭此模式,我不知道为什么。我花了更多的时间来解决这个问题,这是一个代码: let modalShow; if(this.chooseRounds > 0 && this.state.rounds == this.state.roundsValue) { modalShow = (

您好,我希望在满足条件时关闭模式
(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>
        )
    }
let modalShow;
if(this.chooseRounds>0&&this.state.rounds==this.state.roundsValue){
modalShow=(
闭合模态
);
}否则{
modalShow=(
闭合模态
)
}
在状态中,我有
showmodel:false,

HandleModel函数内部有
this.setState({showmodel:!this.state.showmodel})

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

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

您不需要将ReactModal分配给变量。只需在渲染函数中使用它,如下所示:

handleCloseModal() {
    this.setState({ showModal: false });
}

handleOpenModal() {
    const showModal = this.chooseRounds > 0 && this.state.rounds == this.state.roundsValue

    this.setState({showModal})
}

render(){
    const {showModal} = this.state
    return(
       <ReactModal
           isOpen={showModal}
           contentLabel="Minimal Modal Example"
           ariaHideApp={false}
        >
           <button onClick={this.handleModal}>Close Modal</button>
       </ReactModal>
    )
}
handleCloseModal(){
this.setState({showmodel:false});
}
handleOpenModal(){
const showmodel=this.chooseRounds>0&&this.state.rounds==this.state.roundsValue
this.setState({showmodel})
}
render(){
const{showmodel}=this.state
返回(
闭合模态
)
}

此代码不显示模式我在我的代码模式显示后条件中看到,但从未将showModal值更改为true,我不知道如何执行此操作。注释不用于扩展讨论;这段对话已经结束。