Question

我的jsx文件中有很多模态，因此，我认为我需要创建一个带有if条件的函数以关闭指定的模态：

赞：

toggleModal = () => {
    if(d){
        this.setState({
            modalIsOpen:{
                Modal1: !this.state.modalIsOpen.Modal1,
            }
        });
    }

    if(d){
        this.setState({
            modalIsOpen:{
                Modal2: !this.state.modalIsOpen.Modal2,
            }
        });
    }

    console.log('click modal');
};

好吧，现在，我不知道要将什么条件传递给if条件，以使其知道要打开/关闭哪种模式。

Answer 1

为什么不创建一个以模式名作为参数的函数？

toggleModal = (modalName) => {
    const newState = {modalIsOpen: {}};
    newState.modalIsOpen[modalName] = !this.state.modalIsOpen[modalName];
    this.setState(newState);
    console.log('click modal');
};

...

toggleModal('Modal1');

Answer 2

简洁明了，您只需要输入模式名称：

const handleCloseModal = name => {
  this.setState(prevState => ({
    modalIsOpen: {
      ...prevState.modalIsOpen,
      [name]: !prevState.modalIsOpen[name]
    }
  }));
}

并这样称呼它：

this.handleCloseModal('Modal1')

一个函数可以关闭指定的模态？

2 个答案: