DEV Community

How to pass extra params to your handlers functions with React?

Pasquale Mangialavori on May 24, 2019

So you want to render a list and pass extra data to your function with React. Well, React does not handle this for you like Angular or Vue with so...
Collapse
 
silvestricodes profile image
Jonathan Silvestri

Is this a good case for some event delegation? Perhaps assigning a click handler to the parent which should be able to give you all the children if you click on one, and then writing appropriate guard clauses to only do things with the info of the DOM node you care about.

Collapse
 
eatsjobs profile image
Pasquale Mangialavori • Edited

You mean somenthing like this?yeah a could add it in the article. thanks

class MyLi extends PureComponent {
_onPress = (evt) => {
const { item, onPress } = this.props;
onPress(evt, item);
}
render() {
return <li onClick={this._onPress}>{this.props.children}</li>
}
}
Collapse
 
ntvinhit profile image
Nguyễn Trọng Vĩnh

I dont always use Map.

Just like:

getHandler(id) {
if (!this.getHandler[id]){this.getHandler[id] = () => ...}
return this.getHandler[id];
}

You can reduce 1 line of code.

Collapse
 
eatsjobs profile image
Pasquale Mangialavori

Yeah you can use a simple object. Maybe an Object.create(null) object is even better