一、表單格式固定的添加表單驗證文章來源:http://www.zghlxwxcb.cn/news/detail-769754.html
<template>
<el-form ref="addForm" :model="form" label-width="100px" :rules="addRules">
<el-form-item label="名稱" prop="name" >
<el-input v-model="addForm.telNumber"></el-input>
</el-form-item>
</el-form>
</template>
data () {
return {
addForm: {
name:'',//名稱
},
addRules: {
name:[{ required: true, message: "名稱不能為空", trigger: "blur" }],
}
}
}
二、動態(tài)增加表單,添加表單驗證文章來源地址http://www.zghlxwxcb.cn/news/detail-769754.html
<template>
<el-form ref="form" :model="addForm" label-width="100px" :rules="addRules">
<el-form-item v-for="(item,index) in addForm.nameList"
label="名稱數(shù)組對象"
:prop="'nameList.'+ index +'.name'"
:rules="addRules.name">
<el-input v-model="item.name"></el-input>
</el-form-item>
</el-form>
</template>
data () {
return {
addForm: {
nameList:[
{name:''}
]
},
addRules: {
name:[{ required: true, message: "名稱不能為空", trigger: "blur" }],
}
}
}
到了這里,關于vue中elment-ui添加表單驗證規(guī)則,以及動態(tài)增加的表單校驗的文章就介紹完了。如果您還想了解更多內容,請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關文章,希望大家以后多多支持TOY模板網(wǎng)!