To do app please help

Hello campers , I want to create to do app , untill now I have two components ,App component and the child component (Form)
I passed two event handlers via props to the Form component onchange and onclick ,
onchange changes the value of the input wich exist in Form and onclick is submiting and adding this value to an array called todos located on the parent App component
to show it in the ul as a list
the problem is that the input is triggered everywhere and also added its value to the list which should be done only by submit button I don’t know what is the problem
here is my code in codesandbox


please check it out .

Move onchange and onclick outside the constructor.

And add e.persist() to onchange

I did what you said , still have the same issue .

1 Like

I didn’t focus ,I have done it in onclick not in onchange that 's why it has not worked ,
please if you could send to me something to read to understand why this hasn’t worked at the first place ,and thank you for your time .

Actually I’m a bit surprised that it worked at all with those methods being inside constructor.

Regarding reading, official docs is always the best place to start: https://reactjs.org/

1 Like