How to add two Actions to a button In react.js

Question

I have a problem in combine 2 action in the same button

<Button
disabled={!isFormValid}`
onClicked={this.submitHandler}
/>

I want to add this function with the previous one

() => this.popUpHandler('update');

This my code

The first action to submit form and next to close popup after that. Do you have any idea about it?

Answer 1

Use Anonymous_functions .

<Button
    disabled={!isFormValid}
    onClicked={ () => {
        this.popupHandler("Update");
        console.log('Button clicked');
    }}
/>

Or create a separate handler;

Class Something extends React.Component {
  onButtonClick() {
      // Do anything
      this.popupHandler("Update");
      console.log('Button clicked');
  }

  render() {
    return (
        <Button
            disabled={!isFormValid}
            onClicked={this.onButtonClick()}
        />
    );
  }
}

Answer 2

You can simply use

    submitHandler(){
    //after some condition  you can call here another function

    this.popUpHandler('update')

    }
    popUpHandler(var){
    //your logic
    }
<Button
    disabled={!isFormValid}
    onClicked={this.submitHandler}
/>