React setState不更新状态

Question

我目前在我的项目中使用react-modal，我有可能从其他组件打开和关闭它。

class MainComponent {
   constructor() {
   this.state = {reportOpen: false};
   }
  closeReport = (e) => {
     this.setState({reportOpen: false}, () => console.log(this.state.reportOpen)); // This line print true !!!
  }
   render() {
      return (
         <Button onClick={(e) => this.setState({reportOpen: true})}/>
         <ReportModal isOpen={this.state.reportOpen} onClose= . {this.closeReport}/>
      )
   }}// Modal
   class ReportModal {
       static getDerivedStateFromProps(nextProps, prevState) {
        if (nextProps.isOpen !== prevState.isOpen) {
          return ({isOpen: nextProps.isOpen});
        }
        else {
          return null;
        }
      }
      render() {
         return <Modal isOpen={this.state.isOpen}
            onRequestClose={this.props.onClose}
            shouldCloseOnOverlayClick={true}
            shouldCloseOnEsc={true}/>
      }
    }

由于上述问题，我打开它后无法关闭模态。请帮我解决这个问题。谢谢你的帮助。

Answer 1

extends React.Component在课堂申报中缺席。缺少super(props);构造函数中的调用。

Answer 2

请在getDerivedStateFromProps上调试新的派生状态。另外，为什么不在ReportModal组件中处理相同的问题，回调似乎过度工作