表单验证遇见的坑
01
如果你受控数据是这样写的话 const formState= reactive({ youForm:{ youNaNe:'', useSlectValue: '001', date1: undefined, delivery: false, type: [], }, });
那么在视图上绑定需要这样来绑定
:model="formState.youForm" 一定要写成这样
不要写成:model="formState"
<a-form ref="formRef" :model="formState.youForm" :labelCol="{ style: 'width: 100px' }" > </a-form>
02
autocomplete="off"
清除input输入框的历史记录;
因为Ant Design Vue中表单会自动记录input框中的值
所以需要我们手动清除
03
下拉框中有数值，但是提示请输入
如果遇见这样的情况。因为你下拉框中的数据类型不正确。
如需要的是字符串，但是你传递的是数字
04
无法进行验证
01==>没有写name值
02==>name值与 v-model中的值不对应
03==>回填时的值类型不正确
04==>没有验证规则
数据类型不正确
<a-form-item ref="name" label="金额" name="money"> <a-input-number id="inputNumber" v-model:value="formState.money" :min="1" :precision="2" :max="10000" /> </a-form-item> 验证规则，一定要添加上字符串类型，否者验证规则可能不能够通过哈 const rules = { money: [ { required: true, message: '请输入', trigger: 'blur' ,type:String}, ] }
