Vue Formulate 是使用 Vue 構建表單的最簡單方法。而且現在可以在element-ui專案中使用，使用方法可以檢視我之前的文章
前端表單驗證對於提供良好的使用者體驗是不可或缺的，但由於配置它所涉及的痛苦， 它經常被忽視。Vue Formulate 極大地減少了前端驗證的彎路，因此沒有理由不使用它。
宣告規則
宣告什麼驗證規則就像
在你的
FormulateInput
欄位中新增一個
validation
prop
一樣簡單
字串語法
宣告在給定表單域上使用哪些規則的最簡單方法是提供由管道 （ |）分隔的規則字串。一些規則可能接受引數，這些是在冒號之後定義的。您可以使用逗號分隔多個引數。
陣列語法
字串語法的替代方法是提供一組規則。有時需要使用陣列語法來保留輸入或轉義某些字元，例如在使用帶有匹配規則的正則表示式時 。 每個規則都必須定義為一個數組，其中規則名稱後跟任何引數。
就本文件而言，管道分隔字串將是為欄位設定驗證規則的首選方法。
筆記：
使用陣列語法時，請確保您的 prop 使用 v-bind：validation 或 ：validation。
顯示驗證
驗證錯誤總是實時計算的，但它們是根據
error-behavior
值顯示的。 預設
error-behavior
為
blur
—— 意味著具有驗證錯誤的欄位僅在使用者從表單域中移除焦點時才顯示其錯誤。 在大多數情況下，這提供了最佳的使用者體驗，因為它可以防止使用者立即收到錯誤訊息的轟炸。當用戶嘗試提交驗證訊息失敗的表單時，也會始終顯示錯誤訊息。
除了
blur
行為之外，
error-behavior
還支援這些附加策略。
報錯行為
說明
blur
（
預設
） 當用戶從輸入中移除焦點時顯示，也會在 @submit 時顯示
submit
只在表單提交時顯示
live
一直顯示
value
只要表單域中有值就在失去焦點和提交表單時顯示
停止驗證
bail
規則
要在遇到錯誤後停止驗證（以防止同時顯示多條訊息）， 您可以新增特殊規則：
bail
。當驗證解析器遇到
bail
規則時，它會記住在遇到任何後續規則中的任何失敗後停止驗證該表單域。
bail
修飾符
通常只在特定規則失敗時才中斷驗證是可取的。例如，如果密碼欄位為空，您可能只想顯示
required
錯誤訊息， 但當它有一個值時，您希望顯示所有失敗的驗證規則。為此，我們可以
^
在規則名稱上使用修飾符。
要檢視以上程式碼塊的執行情況，請點選檢視更多
