Answer the question
In order to leave comments, you need to log in
How to make it so that the data from the Redux Form fields gets into the Store only after the form is submitted?
I have a Redux Form and a component (Let's call it Registry) , into which data from the fields is passed through props, in this component I make such a mutation
const query = gql`mutation MUatation($email: String!, $password: String!){
register(email: $email, password: $password, expiresIn: "24h") {
token
}
}`;
class App extends Component {
render() {
return(
<div>
<Auth/>
{(/*this.props.formData.fields.email.visited &&*/ this.props.formData.values.email !== '') &&
(/*this.props.formData.fields.password.visited && */this.props.formData.values.password !== '')?
<Main
email={this.props.formData.values.email}
password={this.props.formData.values.password}
onSubmit={this.handleSubmit}
/>: null }
</div>
)
}
}
App.defaultProps = {
formData: {
values: {
email: '',
password: ''
}
}
};
export default connect(state => {
return{
formData: state.form.AuthForm
}})(App)
const renderField = ({ input, label, type, meta: { touched, error, warning }}) => (
<div>
<label>{label}</label>
<div>
<input {...input} placeholder={label} type={type} style={touched? error? {borderColor: 'red'}: {borderColor:''}: {borderColor:''}} />
</div>
</div>
);
const Auth = props => {
const { handleSubmit, pristine, reset, submitting } = props;
return (
<form onSubmit={handleSubmit}>
<div>
<div>
<Field
name="email"
component={renderField}
type="email"
placeholder="Email"
/>
</div>
</div>
<div>
<div>
<Field
name="password"
component={renderField}
type="password"
placeholder="Password"
/>
</div>
</div>
<div>
<button type="submit" disabled={pristine || submitting}>
Submit
</button>
<button type="button" disabled={pristine || submitting} onClick={reset}>
Clear Values
</button>
</div>
</form>
)
}
export default reduxForm({
form: 'AuthForm',
initialValues: {
password: '',
email: '',
},
validate
})(Auth)
Answer the question
In order to leave comments, you need to log in
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question