在vue中的表格使用两套验证规则

本文主要是介绍在vue中的表格使用两套验证规则，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

在毕设项目中遇到这么一个问题：
添加社团的时候，需要必须加上社团介绍属性(前台要用)，而添加社团下面的部门时，则不需要添加介绍属性。社团和部门的存储用的是同一张表

主要思路是提供两套验证规则，通过计算得出当前表格需要哪一套验证规则。我在这里的定义的验证规则为:rules="rules"。

<el-form:model="addDeptModel"ref="addDeptForm":rules="rules"label-width="80px":inline="true"size="small">

下面在data()里提供的两套验证规则为

	  //表单验证规则//添加社团就要添加社团介绍ClubRules: {parentName: [{required: true,trigger: "change",message: "请选择上级部门",},],name: [{required: true,trigger: "change",message: "请填写部门名称",},],introduction: [{required: true,trigger: "blur",message: "请填写社团介绍",},{min: 5,max: 18,message: "5-18个字符",trigger: "change",},],},//添加部门介绍选填DepRules: {parentName: [{required: true,trigger: "change",message: "请选择上级部门",},],name: [{required: true,trigger: "change",message: "请填写部门名称",},],},

计算规则的函数：

computed:{rules(){//如果是要添加社团if(this.addDeptModel.parentName =='顶级部门')return this.ClubRules;return this.DepRules;}},

这篇关于在vue中的表格使用两套验证规则的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---