dont need a callback because we habe useEffect

latviancoder · latviancoder · commit 421c970912ae · 2018-11-05T09:06:07.000+01:00
diff --git a/src/components/form-library/FormLibrary.js b/src/components/form-library/FormLibrary.js
@@ -2,16 +2,10 @@ import React, { useState, useEffect, createContext } from "react";
 
 const FormContext = createContext(null);
 
-function MyFormLibrary({ children, initialValues, onValuesChanged, onSubmit, validate }) {
+function MyFormLibrary({ children, initialValues, onSubmit, validate }) {
   const [values, updateValues] = useState(initialValues);
   const [errors, updateErrors] = useState({});
 
-  useEffect(() => {
-    if (typeof onValuesChanged === 'function') {
-      onValuesChanged(values);
-    }
-  }, [values]);
-
   function handleChange(name, value) {
     updateValues({
       ...values,
diff --git a/src/components/form-library/index.js b/src/components/form-library/index.js
@@ -1,11 +1,15 @@
-import React, { useContext } from 'react';
+import React, { useContext, useEffect } from 'react';
 import { object, string } from 'yup';
 
 import MyFormLibrary, { FormContext } from './FormLibrary';
 
 function MyForm() {
   const { values, errors, handleSubmit, input } = useContext(FormContext);
 
+  useEffect(() => {
+    console.info('values changed', values);
+  }, [values]);
+
   return <form onSubmit={handleSubmit}>
     <div>
       <input
@@ -44,9 +48,6 @@ function Screen() {
     onSubmit={(values) => {
       alert('success');
     }}
-    onValuesChanged={(values) => {
-      console.info(values);
-    }}
   >
     <MyForm/>
   </MyFormLibrary>;
