请教一下element的表单验证问题

现在有一个需求是根据用户的不同选择进行判断哪些是必填项。
我的想法是全局给一个 required: true,的变量,然后在watch里面监听用户的选择,动态的改变required的值,在表单验证的时候
name: [

                { required: this.required, message: '请输入活动名称', trigger: 'blur' },
            ],
            name2: [
                { required: true, message: '请输入活动名称', trigger: 'blur' },
            ],

required根据this.required的值来判断,但是这样好像不起作用,然后,我改变验证思路

name: [
                { required: true }, {
                    validator: (rule, value, callback) => {
                        if (this.ruleForm.visitDateType == 1) {

                        }
                    }
                }
            ]传入一个函数,传入一个函数是可以动态的验证了,但是每个都要去写函数,代码就会显得特别多,所以想问问大家还有没有其它的方式进行验证呢,动态的改变某个字端是否需要验证,谢谢大家了
阅读 1.8k
2 个回答

将rules放computed里面
https://jsfiddle.net/wz2exvmn/

data() {
      return {
        ruleForm: {
          name: '',
          check: false
        }
      };
    },
computed: {
        rules1(){
          return {
          name: [
            {
              required: this.ruleForm.check, 
              message: '请输入名称' 
            }
          ]
        }
      }
    }

1、当tag是true 则为比必填
2、当tag为false 则非必填
主要是动态设置tag值

<el-form-item label="姓名" prop="name" :rules="{required:form.tag,message:'请输入姓名'}">
   <el-input v-model="form.name></el-input>
</el-form-item>
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题