Javascript 意外使用'；打开'；ReactJS上没有受限制的全局变量

我用的是一个模态依赖，叫做“反应响应模态”。它工作得很好，但是 突然，它停止执行，出现了一条错误消息：

意外使用“open”no restricted globals

引用此代码行时出现以下错误消息：

<Modal open={open}  onClose={this.onCloseModal} onExited={this.onExited} top>

有人知道怎么解决吗？多谢各位

import React, { Component } from 'react'  
import Modal from 'react-responsive-modal';

class Interiores extends Component {
  constructor(props) {
    super(props)
    this.state = {        
      open: false
    }
  }

  onOpenModal = () => {
    this.setState({ open: true });     
  };

  onCloseModal = () => {
    this.setState({ open: false });
  };  

  render () {
    return (
      <div>             
        <button onClick={this.onOpenModal}>Open modal</button>

        <Modal open={open}  onClose={this.onCloseModal} onExited={this.onExited} top>
          <div>
            <h2>Simple centered modal</h2>
            <p>Text here</p>
          </div>
        </Modal>
      </div>
    );
  }
}

import React，{Component}来自“React”
从“反应响应模态”导入模态；
类内部扩展组件{
建造师（道具）{
超级（道具）
this.state={
开放：假
}
}
onOpenModal=（）=>{
this.setState（{open:true}）；
};
onCloseModal=（）=>{
this.setState（{open:false}）；
};  
渲染（）{
返回(
开放模态
单中心模态
此处文本

);
}
}
这是因为
open
在js中是一个保留关键字


我认为你最好在渲染方法中分解你的状态，比如

const{open}=this.state

但是考虑到变量的意图，最好将其命名为
isOpen:false

或者将渲染方法更改为

      <Modal 
        open={this.state.open}
        onClose={this.onCloseModal}
        onExited={this.onExited}
        top
      >
        <div>
          <h2>Simple centered modal</h2>
          <p>Text here</p>
        </div>
      </Modal>
    </div>
  );
}


单中心模态
此处文本

);
}
exact，但我不知道如何解决它。它可能是从状态中解构使用的。在
render（）{const{open}=this.state；return（…）；}
this.state.open