关于uview小程序表单校验不生效问题，以及小程序自定义校验

Form 表单 | uView - 多平台快速开发的UI框架 - uni-app UI框架

官网例子

rules: {
	name: [
		// 必填规则
		{
			required: true,
			message: '此为必填字段',
			// blur和change事件触发检验
			trigger: ['blur', 'change'],
		},
		// 正则判断为字母或数字
		{
			pattern: /^[0-9a-zA-Z]*$/g,
			// 正则检验前先将值转为字符串
			transform(value) {
				return String(value);
			},
			message: '只能包含字母或数字'
		},
		// 6-8个字符之间的判断
		{
			min: 6,
			max: 8,
			message: '长度在6-8个字符之间'
		},
		// 自定义规则判断是否包含字母"A"
		{
			validator: (rule, value, callback) => {
				return uni.$u.test.contains(value, "A");
			},
			message: '必须包含字母"A"'
		},
		// 校验用户是否已存在
		{
			asyncValidator: (rule, value, callback) => {
				uni.$u.http.post('/xxx/xxx', {name: value}).then(res => {
					// 如果验证不通过，需要在callback()抛出new Error('错误提示信息')
					if(res.error) {
						callback(new Error('姓名重复'));
					} else {
						// 如果校验通过，也要执行callback()回调
						callback();
					}
				})
			},
			// 如果是异步校验，无需写message属性，错误的信息通过Error抛出即可
			// message: 'xxx'
		}
	]
}

编写完了之后发现正则这块不生效

是因为不兼容，如果需要兼容小程序

需要加上

this.$refs.$form.setRules(this.rules)

即可解决

如果校验还没生效请检查标签是否填入必要的属性

<u--form ref="$form" labelPosition="left" :model="form" labelWidth="140rpx" :rules="rules">
    <u-form-item label="姓名" prop="name">
		<u--input v-model="form.name" placeholder="请输入姓名"></u--input>
	</u-form-item>
</u--form>