vue表單的驗證:
關於表單的驗證,在element中提供了驗證表單的方式
在這裏插入代碼片
<el-form-item label="活動名稱" prop="name">
<el-input v-model="ruleForm.name"></el-input>
</el-form-item>
export default{
data(){
return{
rule:{
name:[{
//校驗表單不能爲空
{ required: true, message: '請輸入活動名稱', trigger: 'blur' },
//校驗表單長度
{ min: 3, max: 5, message: '長度在 3 到 5 個字符', trigger: 'blur' },
//自定義表單驗證
{
validator:(rule,value,callback)=>{
//正則表達式驗證方法
//驗證不能輸入漢字
if(value){
if(/[\u4E00-\u9FA5]/g.test(value)){
callback(new Error('不能輸入漢字,請重新輸入'))
}else{
callback()
}}
}}
}]
}
}
}
}
對數字輸入框進行驗證時:
<input v-model.number='formData.age'></input>
此時輸入框才生效進行數字驗證