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.