更新记录
1.0.1(2025-01-05)
下载此版本
无
1.0.0(2025-01-05)
下载此版本
暂无
平台兼容性
App |
快应用 |
微信小程序 |
支付宝小程序 |
百度小程序 |
字节小程序 |
QQ小程序 |
HBuilderX 3.8.7 app-vue app-nvue |
× |
√ |
× |
× |
× |
√ |
钉钉小程序 |
快手小程序 |
飞书小程序 |
京东小程序 |
鸿蒙元服务 |
× |
× |
× |
× |
× |
H5-Safari |
Android Browser |
微信浏览器(Android) |
QQ浏览器(Android) |
Chrome |
IE |
Edge |
Firefox |
PC-Safari |
× |
√ |
√ |
√ |
√ |
√ |
√ |
× |
× |
自定义的验证器
user.js
复制代码
import validate from '@/js_sdk/yoyo-validate/yoyo-validate.js';
class index extends validate {
rule = {
name: 'require|regular:^[\\w\\u4E00-\\u9FA5]{2,15}$',
email: 'require|email|between:5,30',
password: 'require|numberEn|min:5|max:16',
code: 'require|int|between:1,10',
authorization: 'require|isAuthorization',
Bindtype: { require: true, regular: '^(qq|wx)$' }
};
message = {
name: '尊称格式不对哦!',
email: '邮箱地址格式不正确',
code: '验证码格式不正确',
password: '密码不符合规则',
'password.min': '密码最小${1}个字符',
'password.max': '密码最大${1}个字符',
authorization: 'token格式不正确',
};
scene = {
Login: ['email', 'password'],
reg: ['name', 'email', 'password', 'code'],
};
sceneTest(that) {
return that.only(['account'])
.append('password', { min: 1, max: 10, isYoyo: true });
}
isAuthorization(value, field, data) {
if (/^Bearer\s.+\..+\..+$/i.test(value)) {
return true;
}
return 'token格式不正确';
}
isYoyo(value, field, data) {
return true;
}
}
module.exports = (scene) => index.validate(scene);
然后你可以在vue里面调用它
复制代码<template>
<view class="contents">
<text>请随意输入测试即可</text>
<input type="text" v-model="user.email" placeholder="请输入邮箱" />
<input type="safe-password" v-model="user.password" password placeholder="请输入密码" />
<button @click="validateTest">点击验证</button>
</view>
</template>
<script>
import uvalidate from '@/common/validate/user';
export default {
data() {
return {
user: {
email: '1294858802@qq.com',
password: ''
}
}
},
onLoad() {
},
methods: {
validateTest() {
try {
uvalidate('Login').check(this.user);
uni.showToast({
title: '验证通过',
icon: 'success'
});
} catch (e) {
console.error(e.message);
uni.showToast({
title: e.message,
icon: 'none'
});
}
}
}
}
</script>
<style lang="scss">
.contents {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
input {
width: 200px;
height: 30px;
margin: 10px 0;
border: 1px solid #ccc;
border-radius: 5px;
padding: 5px;
box-sizing: border-box;
font-size: 14px;
color: #333;
outline: none;
}
}
</style>