element-plus动态判断表单是否是必填项。出错时显示的错误。在不是必填项时为什么还能显示
选择否后面输入框不可编辑
选择是,后面输入框为必填
现在的问题时,默认是不可编辑的。但是我选择是之后自动校验提示了。
再等我再切回否时。之前的红色提示文字还在。但实际上点表单的提交是可以正常提交的。
解决办法:在最后提交时根据前面的是否再给表单做校验。
<el-form ref="ruleFormRef" :model="formData" label-width="140px" label-position="right" label-suffix=" :" :rules="rules"><el-form-item label="是否民政补贴" > <el-radio-group v-model="formData.subsidySign" class="radioStyle"> <el-radio :value="1">是</el-radio> <el-radio :value="0">否</el-radio> </el-radio-group> </el-form-item> <el-form-item prop="subsidyAmount"> <el-input v-model="formData.subsidyAmount" :disabled="formData.subsidySign != 1" @blur="calcAmount" placeholder="请输入补贴金额" clearable> <template #append>元</template> </el-input> </el-form-item><el-button type="primary" @click="handleSubmit" >确定</el-button></el-form>
const formData = reactive({ subsidySign:0, //是否民政部贴 subsidyAmount: "", //补贴金额 });const rules = reactive({ subsidyAmount: [{ required: false, message: "请输入补贴金额" }], });
const handleSubmit = () => { if(formData.subsidySign==1){//是民政补贴,补贴金额必须填 rules.value.subsidyAmount[0].required=true; }else{ rules.value.subsidyAmount[0].required=false; }}