Skip to content
Advertisement

Passing parameters to event handler from a functional component without using inline syntax

I have following code where I need to pass index value to the event handler which I am getting as a prop from another component. How can I achieve this without using the inline syntax, as inline syntax is not considered as a good approach since it may lead to the creation of new function each time the component re-renders?

JavaScript

Advertisement

Answer

The in-line anonymous function is fine in most cases, but if you want to not do that you can create a curried handler to attach.

JavaScript

This function consumes and encloses an id variable and returns a function that consumes an event object. This returned function is what elements/components will use as a callback.

Pass to component

JavaScript

And attach callback to handler

JavaScript
User contributions licensed under: CC BY-SA
8 People found this is helpful
Advertisement