vue表單驗證規則踩坑


element-ui 官方文檔寫法簡單粗暴,但使用時需要注意rules底下的屬性名(prop)需要與 v-model所綁定的屬性值相同,如下圖,
image
官方好像沒有說v-model的屬性名需要與rules相對應(不知道是不是它的一個小bug),我在命名時沒注意,成功踩了一波坑。
下方rules.name命名需要對應ruleForm.name,否則會出現觸發即警報的情況.
image
如下:
image
當rules的屬性名為'ipAddr', 而v-model對應的屬性名為'ip' 時,有數據且失焦時依然會觸發警報提示
image
image

此時將v-model的屬性名'ip'改成 'ipAddr', 表單域即可正常驗證
image
image
image


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM