2 onSubmit to the same components In React.JS

[freesudani]

Im currently new to react and i was following along a youtube video coding a todo-list using react.js links below
in the TodoForm functional component it returns the form tag with the attribute onSubmit={handleSubmit}

 return (
    <form onSubmit={handleSubmit} className='todo-form'>
      {props.edit ? (

but in the TodoList file where the TodoForm is imported the TodoForm component tag has the attribute of of

<TodoForm onSubmit={addTodo} />

im confused about having two onSubmit attributes to the same component , ill be graetful if someone can clarify it for me.

github link

Youtube

[DanCouper]

It doesn’t have two. You pass a function to TodoList, So, as a contrived example:

function printName (name) {
  return `Name is: ${name}`;
}

function printEmail (email) {
  return `Email is: ${email}`;

function user (id, name, email)
  return `
User ID ${id}:
- ${printName(name)}
- ${printEmail(email)}
`;
}

user doesn’t have two name attributes or two email attributes. You pass an argument for name to user, which gets passed to the printName function. You pass email to user, which gets passed to the email function.

---

In yours, a function is passed to the TodoForm component function as an argument. That function is passed to the form component as an argument (that’s also a function).