element中el-form表单提交,根据不同的条件会有不同的rulus校验

<el-form
	ref="form"
	inline
	:model="billDetailCopy"
	:rules="rules"
	size="small"
	label-position="right"
	label-width="110px">
 <el-form-item
 	v-for="(item,index) in listFilter"
 	:key="index"
 	:prop="item.key"
 	:label="item.label" >
      <el-input
        style="width: 200px"
        :maxlength="item.key === 'billingNo' ? 12 : item.key === 'billingCode' ? 8 : ''"
        v-model="billDetailCopy[item.key]"
        :placeholder="item.placeholder"
      >
      </el-input>
    </el-form-item>
   </el-row>
</el-form>



 handleClick(name) {
        if (name === '增值税专用发票') {
          this.$set(this.rules, 'feeWithoutTax', [{ required: true, trigger: 'change',validator: validateAmount }])
          this.$set(this.rules, 'tax', [{ required:true, trigger: 'blur', validator: validateAmount } ])
        } else {
          this.$delete(this.rules, 'feeWithoutTax')
          this.$delete(this.rules, 'tax')
        }
        this.handleReset()
 },
 handleReset() {
 	// 为什么使用 nextTick,因为页面的数据是会随时改变的,在computed监听了页面渲染的数据,所以他们的执行顺序是  handleClick ---》handleReset---〉computed 所以每次重置页面都是有提示,
  this.$nextTick(() => {
    this.$refs['form'].clearValidate();
    this.$refs['form'].resetFields();
  })
},

两种校验字段不同

在这里插入图片描述
在这里插入图片描述

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值