element ui 表单验证为正整数

很多时候都会用表单中输入正整数的情况,在element ui中可以用el-input-number 标签来显示输入框是number类型的,或者type="number"也可以的,但是正整数就需要判断了

可以利用正则来判断

代码如下

<el-form ref="checkData" :rules="checkData" :model="eyPara" label-position="left" label-width="100px">
  
     <el-form-item label="值:" prop="amErrYear">
                  <el-input v-model="eyPara.amErrYear" placeholder="输入值" clearable/>
              </el-form-item>
</el-form>
 
export default{
data(){
   const blurText = async(rule, value, callback) => {  
        // const reg = /^\-\d\.?\d*$/
        // const boolean = reg.test(value)
        const boolean = new RegExp('^[1-9][0-9]*$').test(value)
        // console.log(boolean)
        if (!boolean) {
          this.$message.warning('请输入正整数')
          this.eyPara.amErrYear = ''
        }
      }
 
   return {
  
eyPara: {
        amErrYear: ''
      },
checkData:{
  
  amErrYear: [
          { required: true, message: '输入值', trigger: 'blur' },
          { validator: blurText, trigger: 'blur' }  //表单验证的时候会调用的方法
        ],
}
} 
}
}
rules表单验证规则,异步表单验证,validator 是根据校验规则得到的校验器 ,自定义校验 callback 必须被调用。 更多高级用法可参考 async-validator
 
 
 
 
posted @   NicoleYe  阅读(6531)  评论(0编辑  收藏  举报
编辑推荐:
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
阅读排行:
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· 【自荐】一款简洁、开源的在线白板工具 Drawnix
· 没有Manus邀请码?试试免邀请码的MGX或者开源的OpenManus吧
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
· 无需6万激活码!GitHub神秘组织3小时极速复刻Manus,手把手教你使用OpenManus搭建本
点击右上角即可分享
微信分享提示