InputNumber 有值但是验证却不能够通过
今天遇见这样一个问题,InputNumber 输入框中有值
但是却却提示验证不能够通过
后来经过分析,怀疑是数据类型不正确,
后面经过验证,果然是数据类型不正确
正确做法
<template> <div> <a-form ref="formRef" :model="formState" :rules="rules" :label-col="labelCol" :wrapper-col="wrapperCol" > <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> <a-form-item> <a-button type="primary" @click="onSubmit">Create</a-button> <a-button style="margin-left: 10px" @click="resetForm">Reset</a-button> </a-form-item> </a-form> </div> </template> <script> import { reactive } from '@vue/reactivity' export default { setup () { const rules = { money: [ //这里一定要添加上数据类型是字符串类型的。 //否者验证不会通过 { required: true, message: '请输入', trigger: 'blur' ,type:'string'}, ] } let formState=reactive({ money:'' }) function onSubmit(){ console.log(formState); } function resetForm(){ console.log(formState); } return { rules, formState, onSubmit, resetForm } } } </script>