Как вызвать класс и установить setState в один onClick (ReactJS)

Question

Я довольно новичок в React, и мне было интересно, как я могу вызвать функцию внутри класса (например, this.handleChange) и функцию стрелки с setState внутри в пределах одного onClick кнопки.

Я пытался использовать запятые и && между двумя строками кода.

<button name="Plus" onClick={() => this.setState({ Operator: 'plus' }) && this.handlePlus}>+</button>

Приведенный выше код находится внутри рендера и возврата.

Ожидаемый результат - код вызываетфункция и меняет состояние. Вместо этого он просто меняет состояние (так же, как и первая часть).

Пожалуйста, помогите, заранее спасибо!

Answer 1

setState() имеет необязательный второй параметр, который является функцией, которая будет вызываться после установки состояния. Вы можете сделать:

this.setState({ Operator: 'plus' }, this.handlePlus);

Вы также можете использовать жизненный цикл componentDidUpdate:

componentDidUpdate(prevProps, prevState) {
  if(this.state.Operator === 'plus' && prevState.Operator !== 'plus') {
    this.handlePlus();
  }
}

Answer 2

Просто добавьте this.setState({ Operator: 'plus' } в функцию handlePlus.

Answer 3

< button name = "Plus"
onClick = {
  () => this.setState({
    Operator: 'plus'
  }, () => this.handlePlus())
} > + < /button>

this would work fine.or
if you are looking
for something like this....
you can handle multiple buttonClick event like this

  <
  button name = "Plus"
value = "yourValue"
onClick = {
  this.handleChange
} > + < /button>

handleChange = (e) => {
  const {
    name,
    value
  } = e.target;
  switch (name) {
    case 'Plus':
      this.setState({
        [name]: value
      });
      break;
    default:
      //enter code here
      break;
  }

}