Vue Element 之表單驗證

注:這裏不是必要的,可以直接看下面的實現步驟部分

首先,來到Element官網,查看“表單驗證”源碼案例
在這裏插入圖片描述
在這裏插入圖片描述

Form 組件提供了表單驗證的功能,只需要通過 rules 屬性傳入約定的驗證規則,並將 Form-Item 的 prop 屬性設置爲需校驗的字段名即可

trigger

  • ‘blur’ :失去焦點觸發
  • ‘change’:發生改變觸發

下面,開始動手實現啦

實現步驟

第一步:在form上添加屬性綁定:rules指定校驗對象
在這裏插入圖片描述
第二步:在data數據中定義校驗對象
在這裏插入圖片描述
第三步:對錶單項from-item通過prop指定驗證規則

至此,完成
——————————————————分割線——————————————————
效果圖
在這裏插入圖片描述
在這裏插入圖片描述

發佈了39 篇原創文章 · 獲贊 6 · 訪問量 9732
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章