vue添加表单验证规则,分为两种,一种是表单格式固定的,另一种是动态增加删除列表的表单
-
表单格式固定的添加表单验证
form表单对象内容格式如下:
form:{
telNumber:''
}
form表单列表格式如下:
<el-form ref="form" :model="form" label-width="100px" :rules="rules">
<el-form-item label="手机号码"
prop="telNumber">
<el-input v-model=""></el-input>
</el-form-item>
</el-form>
rules对象如下:
rules:{
telNumber:[{requrie:true,message:'手机号码不能为空!',trigger:['blur','change']}]
}
-
动态增加删除表单,添加表单验证
form表单对象内容格式如下:
form:{
telNumber:[{value:''}]
}
form表单列表格式如下:
<el-form ref="form" :model="form" label-width="100px" :rules="rules">
<el-form-item v-for="(item,index) in "
label="手机号码"
:prop="'telNumber.'+ index +'.value'"
:rules="">
<el-input v-model=""></el-input>
</el-form-item>
</el-form>
rules对象如下:
rules:{
telNumber:[{requrie:true,message:'手机号码不能为空!',trigger:['blur','change']}]
}