Search code examples
reactjsinputonchange

How to pass multiple arguments to an Inputs onChange listener?


I am using React hooks, not the class based approach.

So I have a Person component which has an Input element assigned to it. I need to pass the event(from which I extract the new/changed value) and an index to the listener function.

How can I pass both the event and the index?

return (
            <Person
//other attributes
              change={renamePersonHandler.bind(this, (event, index))}
            />
          );

onChange listener.

   const renamePersonHandler = (event, id) => {
    // does stuff
  };

Solution

  • Figured it out. The Input element value is passed to the function automatically. It's enough to just bind it and specify the other argument.

         return (
                <Person
    //other attributes
                  change={renamePersonHandler.bind(this, person.id)}
                />
                );