Should I use redux-form store instead of component state and Redux custom store?

Question

I believe in any application there should be one source of truth.

---

My app will be having

• 90+ transaction forms and 150 reports
• Complex data s

Answer 1

If you don't need to execute async tasks i.e async form validations then it's easy to create a custom form generator component instead of using redux-form which is much complex, adds an extra layer of boilerplate & force you to use redux. For ref. check it. https://github.com/bietkul/react-native-form-builder

Answer 2

Thanks to erikas for the beautiful library. I have been using since it was born nearly two years ago.

I personally don't use redux-form for data manipulation. I do it by self in component state by onChange setting state. When I came to know data store in redux-form, I initially used it, but as my use cases grew, I have to shift data store to component state. Data modelling in react is something that you need to learn, it won't come by magic. But once you do it you will never get confused about Overrated state management in React

If you are performing Data modelling, dependent computations I will recommend using component state for data.

Thumb Rules:

• Use only one store through the app to store state
• If using Component state then don't use redux-form state (recommended)
• If using redux-form state then don't use Component state (limitation - point 1,2,3 and code dirty magic behind the scene managing store)
• You are right. It was born for validation, so use it for validation.
• Use redux custom store as toggle, user sign-in global data flavor. But not for storing actual transactional form state (limitation -will do over coding).

• If your app is going to be complex I recommend you to use

  • component state - actual form state with onChange

  • redux - use it for global in mngt(toggle,post drafts, users login info only only)

  • redux-from - for validation only and not as data store for submition

  • I also discourage you from keeping heavy, complex, state, and transactional form state in redux custom store. Just use it like ice-cream toppings.

Pros: Component state - Full control over data, flexibility what comes in what goes out, no magic behind the scenes

Cons: I didn't found any

Conclusion: redux-form is basically for very newbies to get things done quickly, but when it comes to computations, dependent fields, commercial data modelling,redux-form is not the option. But even if you do use redux-form for data manipulation soon you will be ending up with using (component state which cannot be ignored + redux-form state + redux custom state) scattered all over with confusion.

Note : I liked @vijays answer react-chopper library below , it fits all your computation requirements.Also its better than 100% better than mobx and other libraries as they dirty the code

But This react-chopper Examples is quiet empressive

It feels 100% like angular.But its uni flow from inside

Disclaimer: react-chopper is still in development And could be used for only simple to medium usecases.

Answer 3

After nearly seven frustrating months

I created a new library, React-chopper.

A revolutionary two-way binding in React that will meet any business object complexity, almost like AngularJS.

Enjoy! Code like AngularJS in React.

Answer 4

I would recommend using Redux-Form only for collection and validation of data. Utilize your own component state and/or custom redux store if and when appropriate.

You're correct in only using redux for state that is to be shared. Keep things simple and reusable.

Good reading:

https://goshakkk.name/should-i-put-form-state-into-redux/

https://hackernoon.com/using-forms-in-react-redux-tips-and-tricks-48ad9c7522f6

https://medium.com/dailyjs/why-build-your-forms-with-redux-form-bcacbedc9e8