formik onSubmissionError

src/components/passport/common/Effect/index.js → src/components/passport/common/OnSubmissionError/index.js

 import {useEffect} from 'react'
+import {connect} from "formik";
+
+const OnSubmissionError = props => {
+    const {callback, formik} = props
 
-export default function Effect(props) {
-    const {submitCount, isValid} = props.formik
     const effect = () => {
-        if(submitCount > 0 && !isValid){
-            props.onSubmissionError()
+        if(formik.submitCount > 0 && !formik.isValid && !formik.isSubmitting){
+            callback(formik)
         }
     }
-    useEffect(effect, [submitCount])
+    useEffect(effect, [formik.submitCount, formik.isSubmitting])
     return null
 }
+
+export default connect(OnSubmissionError)
\ No newline at end of file

src/components/passport/forgotPassword/index.js

@@ -9,7 +9,7 @@ import { Toast } from "antd-mobile";
 import { HeaderBar, Captcha, ClearableInput } from "@/common";
 import { validateTel, validateEmail, http, api } from "@/utils";
 import { quickLogin } from '@/store/userAction';
-import Effect from '../common/Effect'
+import OnSubmissionError from '../common/OnSubmissionError'
 
 
 class ForgotPassword extends Component {
@@ -85,7 +85,7 @@ class ForgotPassword extends Component {
                                 }}
                             />
                         }
-                        <Effect formik={this.props} onSubmissionError={this.onSubmissionError}/>
+                        <OnSubmissionError callback={this.onSubmissionError}/>
                         <Captcha getInstance={this.getCaptchaInstance} onVerify={this.onVerify}/>
                         <Button active={isValid}>下一步</Button>
                     </Form>