Question

美好的一天！

是否可以在onClick事件上触发多个功能？

我希望用户单击我的按钮进入setState然后运行一个函数。我设法更新了状态，但是我不确定如何继续添加第二步，即运行名为“ goToOrderTemplate（）”的函数。

<button
  type="button"
  className="btn btn-primary"
  style={{ width: 250 }}
  onClick={() =>
    this.setState({
      auth: this.passwordValidation()
    })
  }
>

任何帮助将不胜感激！

Answer 1

setState使用第二个参数，这是一个回调，在设置状态后会被回调。如果goToOrderTemplate取决于所设置的状态，则应使用该值：

this.setState({
  auth: this.passwordValidation(),
}, goToOrderTemplate)

通常情况下，您要调用两个函数，只需执行以下操作：

onClick={() => { 
  this.setState({
    auth: this.passwordValidation(),
  });
  goToOrderTemplate();
}}

Answer 2

您可以将回调函数作为第二个参数传递给this.setState

this.setState({
  auth: this.passwordValidation()
}, () => {
  goToOrderTemplate()
})

反应onClick setState然后运行功能

2 个答案: