uniapp 自定义校验

之前做app项目关于自定义检验方面的内容在此记录一下

需求:在app端实现跟pc端相同的校验规则

前提:pc端使用的是elementui表单校验

在自己动手写之前,先看了一下插件市场关于自定义检验的表单组件,一是觉得不是很好用,二是当时决定尽量少用插件,因此决定自己手写一个自定义校验的方法,在项目中使用。

关于pc端elementUI检验规则是如下这种写法:

formRules = {
        inventoryYear:[
            {required:true,message:'请选择盘点年份',trigger:'change'}
        ],
        inventoryMonth:[
            {required:true,message:'请选择盘点月份',trigger:'change'}
        ],
        accessoryMaterialName:[
            {required:true,message:'请输入配件材料名称',trigger:'change'}
        ],
        qualityStatus:[
            {required:true,message:'请选择质量状况',trigger:'change'}
        ],
        inventoryNumber:[
            {required:true,message:'请输入盘点数量',trigger:'change'},
            {pattern: /^\d+\.?\d{0,8}$/, message: "盘点数量只能为数值并保留八位小数",trigger: "change"},
        ]
    }

为了可以方便直接使用,决定在此基础上写一套关于app的自定义校验规则。

分析:当表单完成输入时,数据是如下这种格式

baseInfo = {
	inventoryYear:1,
	inventoryMonth:1,
	accessoryMaterialName:1,
	qualityStatus:1,
	inventoryNumber:1
}

因此只需要将校验规则中的规则依次拿出与数据进行匹配是否满足即可。

需要解决的问题:

1.只要有一个不满足就不向下继续匹配,并提示有数据不符合要求
2.兼容elementui的规则配置,

  • 2
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值