react ant design 表单自定义正则校验手机号

react ant design form表单自定义校验手机号

直接上码：

class Login extends React.Component {
phoneValidator = (_, value, callback) => {
        if (value) {
            let reg = /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/;
            if (reg.test(value)) {
                this.setState({
                    userPhone: value
                })
                return callback();
            }
            return Promise.reject(new Error('手机号无效'));
        } else {
            return Promise.reject(new Error('手机号不得为空'));
        }

    }


render() {
        return (
			<Form
				ref={this.formRef}
			    name="normal_login"
			    className="login-form"
			    hideRequiredMark
			    layout="vertical"
			    onFinish={this.onFinish}>
				    {/* 手机号 */}
				    <Form.Item
				    label="手机号"
				    name="phone"
				    rules={[{ validator: this.phoneValidator }]}>
				          <Input placeholder="请输入手机号" />
				    </Form.Item>
			</Form>
		}
	}
}

我用的是react类的方式来写的，用react函数的方式可能会有差异，请多多指教。