fix: get FormField maybe undefined

mjolnirjs · Aug 29, 2019 · df3c786 · df3c786
1 parent 0693624
commit df3c786
Show file tree

Hide file tree

Showing 4 changed files with 20 additions and 5 deletions.
diff --git a/example/src/UserForm.tsx b/example/src/UserForm.tsx
@@ -7,9 +7,10 @@ import * as React from 'react';
 export const UserForm = () => {
   const model = useStatedBean(UserModel);
 
+  console.log(model);
   const { errors } = model.getFormField('user');
 
-  const handleSubmit = async e => {
+  const handleSubmit = async (e: React.MouseEvent) => {
     e.preventDefault();
     const valid = await model.validate('user');
     if (valid) {

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "stated-form-bean",
-  "version": "0.1.0-beta.5",
+  "version": "0.1.0-beta.6",
   "description": "",
   "main": "dist/cjs",
   "module": "dist/es",

diff --git a/src/core/FormField.ts b/src/core/FormField.ts
@@ -11,7 +11,7 @@ export class FormField<Values> {
 
   constructor(
     public readonly field: string | symbol,
-    private readonly _schema?: yup.Schema<Values>,
+    private _schema?: yup.Schema<Values>,
   ) {}
 
   get errors() {
@@ -67,6 +67,10 @@ export class FormField<Values> {
     };
   }
 
+  setSchema(schema: yup.Schema<Values>) {
+    this._schema = schema;
+  }
+
   _addError(error: yup.ValidationError) {
     if (error.inner) {
       if (error.inner.length === 0) {

diff --git a/src/core/FormModel.ts b/src/core/FormModel.ts
@@ -18,11 +18,21 @@ export class FormModel<Values> {
     field: T,
     schema: yup.Schema<Values[T]>,
   ): void {
-    this[fields][field] = new FormField(field as (string | symbol), schema);
+    const formField = this[fields][field];
+    if (formField !== undefined) {
+      formField.setSchema(schema);
+    } else {
+      this[fields][field] = new FormField(field as (string | symbol), schema);
+    }
   }
 
   getFormField<T extends keyof Values>(field: T): FormField<Values[T]> {
-    return this[fields][field];
+    const formField = this[fields][field];
+
+    if (formField === undefined) {
+      this[fields][field] = new FormField(field as (string | symbol));
+    }
+    return formField;
   }
 
   validate<T extends keyof Values>(