upog
upog

Reputation: 5531

react hooks - get event Object and parameters on button click

I have a button as below

<a href="#" className={classes.btnText} onClick={showDetail}>Learn more <span> &rarr; </span> </a>

and able to get the event object

const showDetail = event => {
        console.log("show detail",event);
    }

Now i want to pass an argument on button click. can some one please tell me how to pass event plus an parameter on button click like showDetail(event, "test") and i dont want the function to be invoked until the button is clicked

Upvotes: 0

Views: 143

Answers (2)

NinjaDev
NinjaDev

Reputation: 402

<a href="#" className={classes.btnText} onClick={(e) => showDetail(e, "test")}>Learn more <span> &rarr; </span> </a>

const showDetail = (event, additionalData) => {
        console.log("show detail", additionalData, event);
    }

Upvotes: 4

Aobo Cheng
Aobo Cheng

Reputation: 4528

Make it a function which returns a function

const showDetail = type => event => {
  console.log("show detail", type, event);
}
<a href="#" className={classes.btnText} onClick={showDetail("test")}>
  Learn more <span> &rarr; </span>
</a>

this is a currying function, the type variable can be accessed from event callback

Upvotes: 1

Related Questions