У меня есть два действия, которые нужно передать моей кнопке onClick при реагировании. js. Но когда мне это не удается? Есть ли решение, чтобы решить это? - PullRequest
0 голосов
/ 10 февраля 2020

Рассмотрим приведенный ниже код:

                    <Modal.Footer>
                    <Button variant="danger" onClick={()=>{
                        {this.props.onHide};
                        {()=> this.setState({userDetailModalShow: true})};
                    }}>User Detail</Button>
                      <Button variant="danger" onClick={this.props.onHide}>close</Button>
                    </Modal.Footer>

Так что, когда я нажимаю кнопку сведений о пользователе, будет отображаться модальность сведений о пользователе, в то же время скрывается предыдущий модал. Но я получаю сообщение об ошибке при множественном действии onClick пользовательских данных. Мой код неправильный? или есть другой способ?

Ответы [ 4 ]

1 голос
/ 10 февраля 2020

Я бы сделал это так:

   // use handler function is cleaner
   handleClickUserDetail = (e) => {
     e.persist(); // persist the event to send it to onHide if needed
     e.preventDefault();

     this.props.onHide(e); // send the event to onHide if needed
     this.setState({ userDetailModalShow: true });
   }

   render() {
     return (
       <Modal.Footer>
         <Button 
           variant="danger" 
           onClick={this.handleClickUserDetail}
          >
           User Detail
          </Button>
          <Button 
            variant="danger" 
            onClick={this.props.onHide}
          >
            close
          </Button>
       </Modal.Footer>
     );
   }

Надеюсь, это поможет;)!

1 голос
/ 10 февраля 2020

Ты пробовал вот так?

<Modal.Footer>
   <Button variant="danger" onClick={()=>{
       this.props.onHide();
       this.setState({userDetailModalShow: true});
   }}>User Detail</Button>
   <Button variant="danger" onClick={this.props.onHide}>close</Button>
</Modal.Footer>
1 голос
/ 10 февраля 2020

Почему бы вам не поместить их в функцию?

clickHandler = ()=>{
    this.props.onHide();
    this.setState({userDetailModalShow: true}
}
 <Modal.Footer>
                    <Button variant="danger" onClick={()=>{()=> clickHandler()}}
                    }>User Detail</Button>
                      <Button variant="danger" onClick={this.props.onHide}>close</Button>
                    </Modal.Footer>
0 голосов
/ 10 февраля 2020

Вы должны написать встроенный код, подобный этому, так как может быть синтаксис и ошибка области действия

onClick={() => { func1(); func2();}}
...