elmentui 表单验证问题
作者:互联网
<template>
<div>
<el-form ref="rateData" :model="rateData" :rules="DataRules" class="demo-ruleForm">
<div v-for="(item, index) in rateData.ratesList" :key="index">
<div>功率段{{ index + 1 }}:</div>
<el-form-item :prop="'ratesList.' + index + '.minPower'" :rules="[
{ maxPower: item.maxPower, validator: validateRate, trigger: 'blur' }
]">
<span>起始功率:</span>
<el-input v-model="item.minPower" />
<span>瓦</span>
</el-form-item>
<el-form-item :prop="'ratesList.' + index + '.maxPower'" :rules="[
{ minPower: item.minPower, validator: validateRate, trigger: 'blur' }
]">
<span>截止功率:</span>
<el-input v-model="item.maxPower" :disabled="rateData.ratesList.length -1 == index ? false : true " />
<span>瓦</span>
</el-form-item>
<el-form-item :prop="'ratesList.' + index + '.money'" :rules="DataRules.money">
<span>执行标准:</span>
<el-input v-model="item.money" />
<span>元/小时</span>
</el-form-item>
</div>
</el-form>
</div>
</template>
<script>
export default {
methods: {
validateRate(rule, value, callback) {
var start = rule.fullField.indexOf('.')
var end = rule.fullField.lastIndexOf('.')
var index = rule.fullField.slice(start + 1, end)
if (value === '') {
callback(new Error(' '))
} else if (this.rateData.ratesList[index].maxPower <= this.rateData.ratesList[index].minPower) {
callback(new Error('最小功率不能大于最大功率'))
} else if (this.rateData.ratesList[index].maxPower > this.custompower) {
this.$message.error('截止功率不能大于最大额定功率')
callback(new Error(' '))
} else {
callback()
}
},
}
}
</script>
标签:index,功率,验证,rule,表单,callback,fullField,var,elmentui 来源: https://www.cnblogs.com/web-simon/p/16463220.html