Please tell me about the form validation problem of element

now there is a requirement to determine which items are required based on the user"s different choices.
my idea is to globally give a variable of required: true, and then listen to the user"s selection in watch, dynamically change the value of required,
name: [

when the form is validated.
                { required: this.required, message: "", trigger: "blur" },
            ],
            name2: [
                { required: true, message: "", trigger: "blur" },
            ],

required judges according to the value of this.required, but this doesn"t seem to work, and then I change my verification thinking

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

                        }
                    }
                }
            ]
May.19,2022

put rules in computed
https://jsfiddle.net/wz2exvmn/

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

1. It is required when tag is true
2. When tag is false, it is not required
. It mainly sets tagging values dynamically

<el-form-item label="" prop="name" :rules="{required:form.tag,message:''}">
   <el-input v-model="form.name></el-input>
</el-form-item>
.
Menu