sxw-validator

安装

npm install sxw-validator --save

import GsForm from 'sxw-validator/form';
import GsFormItem from 'sxw-validator/item';

<gs-form :model="formItem" :rules="rules" ref="fromRule">
	<gs-form-item prop="mobile" ref="mobile">
		<input type="text" v-model="formItem.mobile" @blur="handleMobile">
	</gs-form-item>
</gs-form>
<div @click="submit">提交</div>

data() {
	return {
		formItem: {
			mobile: ''
		},
		rules: {
			mobile: [{
				required: true,
				message: '电话不能为空'
			}, {
				message: '电话格式不正确',
				type: 'mobile'
			}]
		}
	};
},
methods: {
	handleMobile() {
		this.$refs.mobile.validate();
	},
	submit() {
		this.$refs.fromRule.validate((valid) => {
			console.log(valid);
		}, {});
	}
}

form options

参数              参数名                类型        默认值
model             表单数据对象          Object      --
rules             表单验证规则          Object      --

formItem options

参数              参数名                类型           默认值
prop             表单model字段          String        ''
height           错误提示文字高度        Number        32
position         错误提示文字位置        right/bottom  right
top              bottom时顶部距离       Number       32

rules options

参数          参数名          类型          可选值                 默认值
required      必填            Boolean       --                    false
type          类型            String       mobile,deepArray       --
min           最小长度        Number        --                    --
max           最大长度        Number        --                    --
sameKey       与哪个值必须相同 String       --                     --
message       错误消息        String        --                     --