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的规则配置,

你可能感兴趣的:(uniapp,uni-app)