vue 一个el-form-item 绑定多个 input 或者select 校验
vue 一个el-form-item 绑定多个 input 或者select 校验
·
<el-form-item label="触发规则:" prop="ruler" v-if="decustom">
<div v-for="(i,index) in contentForm.ruler" :key="index" class="umar-b20 error_edit">
<div class="flex flex_between">
<div class="flex">
<span>事件类型<span class="umar-lr20">等于</span></span>
<el-form-item :prop="'ruler.'+index+'.ruleType'" :rules="rules.ruleType">
<el-select v-model="i.ruleType" placeholder="请选择">
<el-option v-for="item in rules1Options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<span class="umar-l20 umar-b20">且</span>
</div>
<div class="umar-r20 umar-b20 fz-20 c-p" style="color: #409eff">
<span @click="addRules"> + </span>
<span class="umar-lr20" @click="deleteRules(index,contentForm.ruler)" v-if="contentForm.ruler.length>1"> - </span>
</div>
</div>
<div class="flex">
<el-form-item :prop="'ruler.'+index+'.ruleMoney'" :rules="rules.ruleMoney">
<el-select v-model="i.ruleMoney" placeholder="请选择">
<el-option v-for="item in rules2Options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item :prop="'ruler.'+index+'.judge'" :rules="rules.judge">
<el-select v-model="i.judge" placeholder="请选择" class="umar-lr20">
<el-option v-for="item in judgeOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item :prop="'ruler.'+index+'.money'" :rules="rules.money">
<el-input v-model="i.money" placeholder="请输入" clearable></el-input>
</el-form-item>
</div>
</div>
</el-form-item>
:prop="'ruler.'+index+'.ruleType'" :rules="rules.ruleType"
:prop 里面ruler是和循环的绑定数组对应,ruleType是下拉框或者输入框绑定的model值
:rules 里面的rules 是整体form表单的rules值,ruleType是定义的校验,写在data里面的rules里面
rules: {
ruleType:[
{ required: true, message: '请选择', trigger: 'change' }
],
ruleMoney:[
{ required: true, message: '请选择', trigger: 'change' }
],
judge:[
{ required: true, message: '请选择', trigger: 'change' }
],
money:[
{ required: true, message: '请输入', trigger: 'blur' }
],
}
更多推荐
已为社区贡献9条内容
所有评论(0)