redux-forms | : page_facing_up : A simple form manager for Redux | State Container library

I am using React-Select within React-Final Form. When an option is selected using React-Select it passes an object rather then a single value example {label: Foo, value: 100}. I only need to pass the "value" back to the server. In Redux-Forms you were able to do props.change(), but that doesn't seem to be an option with this React-Final-Forms. I've tried writing on onChange function to store things in state but when I do that the React-Select input no longer holds a value.

FORM

I completely understand the spread syntax of javascript. We use it before an object to rerieve all its properties at once. But recently I saw the spread operator being used for a function, and that function was createForms of react-redux-forms. It was supplied to combineReducer like this

this is where the component is meant to sit (this will be changed to hooks as well eventually):

Currently, in my form, the input fields get validated as soon as the user types in something. Here's the code for that-

index.js

UPDATE: It's not possible to solve from information I gave you, the problem is that code is updated in ComponentReceiveProps hook and original values overwrite changed values.

I work on project developed by external agency that didn't do the best job.

It is front-end application using React, Redux and Redux-Forms

There is one form that is used in two different pages. It works well in one page, but doesn't react in the other. I cannot change value of inputs by UI, neither by changeFieldValue function. Redux state is not changed.

In both cases, the same component is used. It contains reduxForm function.

Before asking this I did a Google search and I didn't find any good resource to manage a form only with Redux. All of the examples use redux-forms. It is only one form and I don't want to install that library to use only on one, minimal, small form.

I can't use local state because the user has the option to go to another screen and then be back on the screen which contains the form, so at some point the component could be unmounted and mounted again and I want it to keep its state.

This is the component I have so far and the way I've been working on it:

I'm using redux-forms fileds with a react-select. After changing the value the onChange function does show the value. I want to check the value and for specific values open a dialog box to let the user confirm the selection.

I am attempting to remotely submit a form using redux-forms. My question would be, how do I execute redux actions from a function outside the component. The equivalaent of saying:

this.props.action(params);

My code is as follows:

I was falling in love with TypeScript until I found some very discouraging incompatibilities between Redux-Form with React-Redux.

My goal is wrap a reduxForm decorated component with the react-redux connect decorator—this pattern has always worked for me in babel configurations and seems to follow the HOC methodology. Here's an example: