表單提交

提交階段

要在 Formik 中提交表單,您需要以某種方式觸發提供的 handleSubmit(e)submitForm 屬性。當您呼叫這些方法中的任何一個時,Formik 每次都會執行以下操作(虛擬碼)

預提交

  • 觸碰所有欄位。 需要 initialValues 並且應始終指定。 請參閱 #445
  • isSubmitting 設定為 true
  • submitCount 加 1

驗證

  • isValidating 設定為 true
  • 非同步地執行所有欄位級別驗證、validatevalidationSchema,並深度合併結果
  • 有任何錯誤嗎?
    • 是:中止提交。 將 isValidating 設定為 false,設定 errors,將 isSubmitting 設定為 false
    • 否:將 isValidating 設定為 false,繼續執行「提交」

提交

  • 繼續執行提交處理程式(即 onSubmithandleSubmit
  • 提交處理程式是否返回 promise?
    • 是:等到它被 resolve 或 reject,然後將 setSubmitting 設定為 false
    • 否: *呼叫 setSubmitting(false)* 以完成循環

常見問題

如何判斷我的提交處理程式是否正在執行?

如果 isValidatingfalseisSubmittingtrue

為什麼 Formik 在提交前會觸碰所有欄位?

通常的做法是僅在輸入的欄位已被訪問(也稱為「已觸碰」)時才在 UI 中顯示其錯誤。 在提交表單之前,Formik 會觸碰所有欄位,以便所有可能隱藏的錯誤現在都可顯示。

如何防止重複提交?

如果 isSubmittingtrue,則停用任何觸發提交的操作。

如何知道我的表單何時在提交前進行驗證?

如果 isValidatingtrueisSubmittingtrue

為什麼 `isSubmitting` 在提交後仍然為 true?如果提交處理程式返回 promise,請確保在呼叫它時正確 resolve 或 reject 它。

如果提交處理程式未返回 promise,請確保在處理程式結束時呼叫 setSubmitting(false)

這個頁面有幫助嗎?

訂閱我們的電子報

最新的 Formik 新聞、文章和資源,將發送到您的收件匣。

版權所有 © 2020 Formium, Inc. 保留所有權利。