How to add click event with React createElement

Question

Following is the code that I'm using to create an HTML tag. I want to add a click event on this. How can I add this?

let elem = React.createElement(
    this.props.tag,
    { 
        style: this.props.style,
        id: this.props.id
        onClick: ()
    },
    [this.props.text]
)

try this stackoverflow.com/questions/31328784/…

sathish kumar
– sathish kumar

2019-03-27 06:04:24 +00:00
Commented Mar 27, 2019 at 6:04 — sathish kumar
– sathish kumar, Commented Mar 27, 2019 at 6:04

Shubham Khatri · Accepted Answer · 2019-03-27 06:12:45Z

21

If you are creating an HTML tag, you simply need to pass on the onClick as a function to the element as props. With React.createElement you can write it like

let elem = React.createElement(
    this.props.tag,
    { 
        style: this.props.style,
        id: this.props.id
        onClick: () => {console.log('clicked')}
    },
    [this.props.text]
)

You could also pass a predefined function like below

let elem = React.createElement(
    this.props.tag,
    { 
        style: this.props.style,
        id: this.props.id
        onClick: this.handleClick.bind(this)
    },
    [this.props.text]
)

answered Mar 27, 2019 at 6:12

Shubham Khatri

284k58 gold badges431 silver badges411 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to add click event with React createElement

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related