手机号的正则表达式校验规则如下:
validatePhone = (rule, value, callback) => {
var phone=value.replace(/\s/g, "");//去除空格
//校验手机号,号段主要有(不包括上网卡):130~139、150~153,155~159,180~189、170~171、176~178。14号段为上网卡专属号段
let regs = /^((13[0-9])|(17[0-1,6-8])|(15[^4,\\D])|(18[0-9]))\d{8}$/;
if(value.length == 0){
callback();
}else{
if(!regs.test(phone)){
callback([new Error('手机号输入不合法')]);
}else{
callback();
}
}
}
扩展:如果是react则全部校验写法如下:
import React, { Component } from 'react';
import { InputItem } from 'antd-mobile';
class Test extends React.Component{
validatePhone = (rule, value, callback) => {
var phone=value.replace(/\s/g, "");//去除空格
//校验手机号,号段主要有(不包括上网卡):130~139、150~153,155~159,180~189、170~171、 176~178。14号段为上网卡专属号段
let regs = /^((13[0-9])|(17[0-1,6-8])|(15[^4,\\D])|(18[0-9]))\d{8}$/;
if(value.length == 0){
callback();
}else{
if(!regs.test(phone)){
callback([new Error('手机号输入不合法')]);
}else{
callback();
}
}
}
render(){
const { getFieldProps, getFieldError } = this.props.form;
const phone = getFieldProps('phone',{
rules:[{ validator: this.validatePhone},],
initialValue: this.state.phone
})
return(
<form>
<InputItem
{...phone}
placeholder="186 1234 1234"
error={!!getFieldError('phone')}
clear
editable={this.state.editable}
><span className="noRequiredContent">联系方式</span></InputItem>
</form>
)
}
}
const BasicInputWrapper = createForm()(Test);