處理表單
vee Validate提供了很多方法去幫助開發(fā)者處理維護表單徐鹤,提交重置等等
使用到目前為止發(fā)現(xiàn)一次v-model都沒用到,因為使用這些高階組件的好處就是省略了大量的js代碼只用在模板上就可以構(gòu)建完一個表單邀层,<Field /> 字段組件實例創(chuàng)建內(nèi)部模型來解決字段值更新問題返敬,并跟蹤它們,使它們與輸入保持同步寥院,當(dāng)然也可以使用v-model但是vee validate并不需要
可以通過從作用域插槽里拿到values當(dāng)前表單的值
Form組件會把表單的值作為第一個參數(shù)傳遞給綁定的函數(shù)
如果有更復(fù)雜的需求也可以從作用域管道里拿一些工具來使用
1.handleSubmit:在任何時候都自動阻止本地提交救赐,用于 AJAX 提交
2.submitForm:只要表單無效,就會阻止本地提交只磷,用于本地提交
3.validate:觸發(fā)表單所有字段的驗證
還有一個isSubmitting可以告訴我們表單是否正在提交中,在表單的提交loading或者禁用按鈕的時候我們就可以用到了
注意在調(diào)用validate時不會觸發(fā) 只有handleSubmit和submitForm才會觸發(fā)
submitCount 是表示用戶提交的次數(shù)也可以拿來使用 代碼就沒寫了
有時候在用戶提交的時候沒通過校驗泌绣,我們想采取一些行動比如發(fā)現(xiàn)email沒有通過給他聚焦 我們可以通過invalid-submit事件
在這個函數(shù)里就可以寫一些校驗失敗提交未通過的邏輯
處理初始值
組件不需要使用v-model值我們可以直接定義一個對象交給他的初始化屬性
設(shè)置表單字段值
setFieldValue 接受兩個參數(shù)第一個是字段名 第二個是字段值
setValues 整個表單的值
也可以在提交函數(shù)里通過第二個參數(shù)actions設(shè)置
重置表單
也是通過作用域插座拿到重置函數(shù)進行調(diào)用
也可以在提交函數(shù)里通過actions里面的方法操作
也可以重置特定的字段
修改error
和設(shè)置字段值一樣 也可以通過提交函數(shù)的actions或者作用域插槽里獲取修改error的方法