Closed ratnabh closed 3 years ago
I am trying to add mobx react form but finding some weird error in it. Here is my code
Formvalidation.tsx
import MobxReactForm from "mobx-react-form"; import dvr from "mobx-react-form/lib/validators/DVR"; import validatorjs from "validatorjs"; import Fields from "../../modules/Admin/LoginSignup/Signup/Fields"; const plugins = { dvr: dvr(validatorjs), }; const fields = Fields; const hooks = { onSuccess(form) { alert("Form is valid! Send the request here."); // get field values console.log("Form Values!", form.values()); }, onError(form) { alert("Form has errors!"); // get all form errors console.log("All form errors", form.errors()); }, }; export default new MobxReactForm({ fields }, { plugins, hooks });
and then when i try to use this in my component like
import { IClasses } from "../../../../interfaces"; import {getFormValidation} from "../../../../shared"; import Fields from "./Fields"; import { observable } from "mobx"; import { MobxReactForm } from "mobx-react-form"; import { observer } from "mobx-react"; interface Props { classes: IClasses; } @observer class Signup extends Component<Props> { constructor(props: Props) { super(props); console.log(Fields); } @observable public myForm: MobxReactForm = getFormValidation(); //here this above line is givng error render() { const { classes } = this.props; return ( <div className={classes.paper}> <h2 className={classes.SignUpText}>Sign Up</h2> <form> <TextField variant="outlined" margin="normal" fullWidth name="firstName" label="First Name" type="text" size="small" /> <TextField variant="outlined" margin="normal" required fullWidth name="lastName" label="Last Name" type="text" size="small" /> <Button type="submit" fullWidth variant="contained" color="primary" className={classes.submit} > Sign In </Button> <div> <Link to="/sign-in" className={classes.routerLink}> Already have an account ? Sign in </Link> </div> </form> </div> ); } } export default Signup;
I get this error
Tried using the new and old version of mobx react form but still same error :(
This error is not related to the package
I am trying to add mobx react form but finding some weird error in it. Here is my code
Formvalidation.tsx
and then when i try to use this in my component like
I get this error![Screenshot 2021-01-02 at 1 52 22 PM](https://user-images.githubusercontent.com/38026695/103453624-c1ffb980-4d01-11eb-8b3c-4f6bf6d33aff.png)
Tried using the new and old version of mobx react form but still same error :(