Element form validation problem

< el-row >

                <el-col :span="12">
                    <el-form-item label="" prop="nationality">
                        <el-radio-group v-model="ruleForm.nationality">
                            <el-radio label="1"></el-radio>
                            <el-radio label="2"></el-radio>
                        </el-radio-group>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item prop="date1" label="" v-if="ruleForm.nationality==2">
                        <el-input v-model="ruleForm.nationalityOther"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>

when selecting other options, the following input box is required
"nationality": [{"required": true}, {

                "validator": function (rule, value, callback) {
               
                }
            }]
            
Apr.27,2022

depends on the ruleForm.nationality value, which can be thrown into the calculation attribute.

<el-form-item :rules="nationalityRule">


computed: {
  isOtherNationality() {
    return this.ruleForm.nationality === '2';
  },
  nationalityRule() {
    return [
      { required: isOtherNationality },
      {
        validator: function(rule, value, callback) {},
      },
    ];
  },
}
Menu