import {
formValueSelector,
//...other imports
} from 'redux-form';
import { connect } from 'react-redux';
const selector = formValueSelector('signupForm');
const SignupForm = ({ gender, ...props }) => (
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
export const h=(t,p,...c)=>({t,p,c,k:p&&p.key}) | |
export const render=(e,d,t=d.t||(d.t={}),p,r,c)=> | |
// arrays | |
e.pop?e.map((e,p)=>render(e,d,t.o&&t.o[p])): | |
// components | |
e.t.call?(e.i=render((render.c=e).t({children:e.c,...e.p},e.s=t.s||{},t=> | |
render(Object.assign(e.s,t)&&e,d,e)),t.i||d,t&&t.i||{}),e):( | |
// create notes | |
e.d=t.d||(e.t?document.createElement(e.t):new Text(e.p)), | |
// diff props |
<Formsy.Form ref="form">
{/* ... input component having value of gender */}
<GenderDependentComponent
value={defaultValue}
currentGender={this.refs.form.getModal().gender}
/>
</Formsy.Form>
// or second method is return
reduxForm({
initialValues: {
{
userName: 'Default User Name'
}
})(SampleForm);
const asyncValidate = (values) => {
// ... returns a promise which does the async operation of validating the field.
};
const renderField = ({ meta }) => {
/* asyncValidating flag in field meta prop to know the status of ongoing async validating action */
const { asyncValidating } = meta; // ... rendering of field
};
const validate = values => {
/* returned object has all errors with name of field as key and error message as value */
const errors = {};
if (!values.userName) {
errors.userName = 'Please enter User Name';
} // ... rest of conditions return errors;
}
const SampleForm = () => ( // ...sample form markup );
/* for defining validation */
Formsy.addValidationRule('isPhoneNo', (values, value) => {
return validPhoneNoRegExPattern.test(value); // assuming validPhoneNoRegExPattern exists
});
/* Inside wrapped form */
<CustomInput
validationError="Should be an email"
/>
/* Inside wrapped form */
<CustomInput
name="email"
validations="isEmail">
<CustomInput
name="number"
validations="isNumeric, isLength:5"
/>
/* return part */
const CustomInput = ({ label, input, meta, ...props }) => (
<div
className={`${(meta.error ? 'error' : '')} ${(meta.warning ? 'warning' : '')}`}
> {
label && {
<span>{label}</span>
}
}
NewerOlder