需求 :表单表单项中两个输入框,可以任意输入一个,也可以两个都输入,当都没有输入时需提示。
思路:通过三元运算符来修改prop绑定的值
<FormItem :prop="formItem.familyName.length == 0 ? 'name' : 'familyName' " label="花名/姓名:" style="width:500px">
<div class="name-wrap">
<Input v-model.trim="formItem.familyName" placeholder="请输入花名" />
<Input v-model.trim="formItem.name" placeholder="请输入姓名" />
</div>
</FormItem>
表单验证:
rules: {
familyName:[{required: true, message: '请输入花名', trigger: 'blur' }],
name:[{required: true, message: '请输入姓名', trigger: 'blur' }],
},
有问题欢迎指出~