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&nbsp;:rules="nationalityRule"> computed:&nbsp;{ &nbsp;&nbsp;isOtherNationality()&nbsp;{&nbsp;&nbsp;&nbsp;&nbsp;return&nbsp;this.ruleForm.nationality&nbsp;===&nbsp;'2'; &nbsp;&nbsp;}, &nbsp;&nbsp;nationalityRule()&nbsp;{&nbsp;&nbsp;&nbsp;&nbsp;return&nbsp;[ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{&nbsp;required:&nbsp;isOtherNationality&nbsp;}, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;validator:&nbsp;function(rule,&nbsp;value,&nbsp;callback)&nbsp;{}, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}, &nbsp;&nbsp;&nbsp;&nbsp;]; &nbsp;&nbsp;}, }