Vue表單驗證控制項vuelidate

vuelidate控制項，可以方便的實現表單驗證功能。

npm install vuelidate

中引入：

import vuelidate from 'vuelidate'
vue.use(vuelidate)

import  from 'vuelidate/lib/validators'

示例原始碼

import  from 'vuelidate/lib/validators'

export default ,
remember_me: true,
error_msg: null
}),validations: ,
login_pwd: ,
},},
render(h) 
}, [
h('div', 
}, [
h('div', 
}, ['vue元件庫平台']),
h('q-input', ,
props: ]
},on: 
}),h('q-input', ,
props: ]
},on: 
}),h('q-btn', ,
props: ,
on: 
if (this.$v.model.login_pwd.$error) 
console.log(this.$v.model)
if (!this.$v.model.$error) },}
}, '登 錄'),
h('div', , [this.error_msg]),
])])
}}

含義required

需要非空資料。檢查僅包含空格的空陣列和字串。

maxlength

要求輸入具有最大指定長度（包括最大值）。適用於陣列。

minlength

要求輸入具有最小指定長度（包括最小值）。適用於陣列。

email

接受有效的電子郵件位址。

between

檢查數字或日期是否在指定範圍內。最小值和最大值都包括在內。

ipaddress

接受點分十進位制表示形式的有效ipv4位址，如127.0.0.1。

alpha

只接受字母字元。

alphanum

只接受字母數字。

numeric

只接受數字。

sameas

檢查給定屬性是否相等。

url只接受**。

or當至少有乙個提供的驗證器通過時通過。

and所有提供的驗證器都通過時通過。

requiredif

僅當提供的屬性為真時才需要非空資料。

requiredunless

僅當提供的屬性為假時才需要非空資料。

minvalue

要求輸入不能少於指定的最小數值或日期。

maxvalue

要求輸入不能大於指定的最大數值或日期。

Vue 表單控制項

textarea 略 input type text 略 單個input type checkbox 多個input type checkbox input type radio select select multiple multiple 有時候希望得到的表單控制項的值不是預設值，可以使用val...

JS控制項 表單驗證

對頁面表單進行驗證的函式 輸入 form物件 輸出 true 驗證通過 false 驗證失敗 使用方法 1 在需要呼叫的頁面中包含validateform.js 如 2 在需要進行校驗的輸入框中新增 validator 驗證型別 name 輸入框名稱 maxlength 長度 例如 目前支援的型別如...

JS控制項 表單驗證

對頁面表單進行驗證的函式 輸入 form物件 輸出 true 驗證通過 false 驗證失敗 使用方法 1 在需要呼叫的頁面中包含validateform.js 如 2 在需要進行校驗的輸入框中新增 validator 驗證型別 name 輸入框名稱 maxlength 長度 例如 目前支援的型別如...