例如验证手机号:
第一步:写自定义校验规则
// 验证手机号
var checkMobile = (rule: any, value: any, callback: any) => {
const regMobile = /^(0|86|17951)?(13[0-9]|15[012356789]|166|17[3678]|18[0-9]|14[57])[0-9]{8}$/
if (regMobile.test(value)) {
return callback()
}
return callback(new Error('请输入正确的手机号'))
}
第二步:在验证表单的配置项下面
let rules = reactive<FormRules>({
phone: [
{ required: true, message: '请填写手机号', trigger: 'blur' },
{ validator: checkMobile, trigger: 'blur' }
]
完成!!!
但是有些大佬会出现以下这种情况
怎么第一个参数(rule)报错了 ???
但是聪明的你依然会发现还能正确验证,代码也能正常跑起来
原来是 ts 搞的鬼,ts告诉我们 声明了但未读取其值, 也就是 这个参数声明了但没有使用
如何解决呢???
只需要到 ts.config.json 中 将这三项设置为 false 或者 注释 即可
"strict": false,
"noUnusedLocals": false,
"noUnusedParameters": false,