DEV Community

Discussion on: Abstracting Click Events in React

Collapse
 
chico1992 profile image
chico1992

I know that "glace" in French is not capitalized, I wanted to go with the same format from the buttons.
I wanted to point out that the implementation is pretty fragile if the business decides one day that more languages need to be supported
something like the following would be safe ass the text will most likely be used as a i18n key depending on the library that is used

handleClick(itemName) {
    if(this.props[`order${itemName}`]===undefined){
        return ()=>{
            console.log("I'm sorry. We don't have that menu item.")
        };
    }
    return this.props[`order${itemName}`];
}
<button onClick={this.handleClick(this.props.text)}>
    {this.props.text} // this.props.text = "Pizza", "Cheeseburger" or "Ice Cream"
</button>