Why is the input data lost in other Inputs when adding an Input?

Question

React

Good afternoon, dear ones.
Got a question. In order not to insert code in pieces, I will insert a sand project so that you can see it in full and test it. Here it is
. The situation is as follows: select "One" in Select, write something in the inputs that appear, then click on Add, and everything that we entered disappears. What am I doing wrong? I've been suffering for several days now.
Thanks in advance for the replies.

Answer 1

The situation is as follows: The addPropertiesToArray
function is called by the add button , you have inside in newArrays: and you set it in state. After changing the state, the render method is called by itself, inside which the propertiesParser function is called. This function goes through the properties and draws the note. At this moment, you don’t have any information about what was entered in the inputs, you didn’t save it anywhere, and called the re-render (since the state was changed in addPropertiesToArray), therefore your components were drawn with an empty value (you, in the markup, indicate value='' => i.e. value = empty string).{Registrations:2}
In order for you to save the entered values, you need to store them somewhere. In your case, I would store them in state, and take these values ​​in input'ax. Of course, in the addPropertiesToArray function, these values ​​would be added to the state.
ps The code itself is not discussed within the framework of this issue, I did not understand your idea, it seems to me that it is written too complicated.