React Modal не работает в компоненте заголовка

Question

У меня есть компонент Login в моем заголовке (начальной загрузке), который должен открывать модальное окно, когда я нажимаю.Я использую модал от реакции-модал (пакет npm).Даже если я не получаю сообщение об ошибке, всплывающее окно не открывается.

this.state={
    openModal:false
}

closeModal=()=>{
    this.setState({openModal:false})
}

 handleOnClick=()=>{
     this.setState({openModal:true}
 }

Компонент заголовка

` <ul className="nav navbar-nav navbar-right">
                    <li onClick={this.handleOnClick()}><a href="#">
                    <Modal 
                        isOpen={this.state.openModal}
                        onRequestClose={this.closeModal}
                        style={customStyles}
                        contentLabel="Example Modal"
                    >
                    <span class="glyphicon glyphicon-user"></span></Modal> Sign Up</a></li>

                    <li><a href="#"><span class="glyphicon glyphicon-log-in"></span> Login</a></li>
                </ul>`

Answer 1

Это рабочий код.

   <ul className="nav navbar-nav navbar-right">
                            <li  onClick={this.handleOnClick}><a href="#">
                            <Modal 
                                isOpen={this.state.openModal}
                                onRequestClose={this.closeModal}
                                style={customStyles}
                                content

                            ><LoginComponent />
                        </Modal> Login</a></li> 

Answer 2

Вам необходимо снять скобки () с звонка.onClick - это вызываемая функция, а не код для запуска, как в других средах, таких как Angular.

Итак, это будет onClick={this.handleOnClick}