ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

elmentui 表单验证问题

2022-07-10 15:35:46  阅读:174  来源: 互联网

标签:index 功率 验证 rule 表单 callback fullField var 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

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有