Today I had to face form definition in react and I was afraid to some kind of repeatitive task.
I looked for in in google, I found formik, react-redux-form, but I see it too complex, or too heavy.
I am using reactstrap for frontend and maybe there is a premium library for form, but I am not sure about how it plays with redux.
Also I do not want realtime link with redux store, but an edit mode then a submit action. In this way I can provide a “cancel” with no pain.
First approach was to useRef, that is it. I put them in an array of fieldElements, just fe because I must write it multiple time (no escape here: multiple input elements).
Also I useSelector for a fieldValues array (again, fv here).
It worked. Then I defined an array, the same is used for defining refs and values:
Then I cleaned up some code:
(fe, field element, became fr, field reference, also)
At the end I see a coupled data in redux storage and the form, I can take storage field list, maybe, not sure
about what happen with innerRef={undefined}, it should give error so that I can find it immediately.
Unfortunately I have no error, I should find some other mean for dealing with it.
There is no validation here, I plan to manage validation in redux-observable eventually, adding some kind of isvalidtagmessage near each field, again using array, useSelector(), the same way. I will see.