element表单验证问题

Question

<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>当选择其它选项的时候，后面的输入框是必填"nationality": [{ "required": true }, {                "validator": function (rule, value, callback) {                                 }             }]             请问这个该怎么写呢？只能包装到一个对象里面吗？

Answer 1

依赖ruleForm.nationality值，正好可以扔计算属性里去。

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


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