diff --git a/packages/client/src/helpers/validator.ts b/packages/client/src/helpers/validator.ts new file mode 100644 index 00000000..126e236c --- /dev/null +++ b/packages/client/src/helpers/validator.ts @@ -0,0 +1,7 @@ +export const isEmail = (email) => { + return !!String(email) + .toLowerCase() + .match( + /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/ + ); +}; diff --git a/packages/client/src/pages/register/index.module.scss b/packages/client/src/pages/register/index.module.scss index 3b94d33a..4366dc25 100644 --- a/packages/client/src/pages/register/index.module.scss +++ b/packages/client/src/pages/register/index.module.scss @@ -9,6 +9,7 @@ position: relative; z-index: 10; display: flex; + height: calc(100% - 52px); padding: 10vh 24px; flex: 1; flex-direction: column; diff --git a/packages/client/src/pages/register/index.tsx b/packages/client/src/pages/register/index.tsx index cb6329f9..e414e526 100644 --- a/packages/client/src/pages/register/index.tsx +++ b/packages/client/src/pages/register/index.tsx @@ -3,11 +3,13 @@ import { Author } from 'components/author'; import { LogoImage, LogoText } from 'components/logo'; import { Seo } from 'components/seo'; import { useRegister, useVerifyCode } from 'data/user'; +import { isEmail } from 'helpers/validator'; import { useInterval } from 'hooks/use-interval'; import { useRouterQuery } from 'hooks/use-router-query'; import { useToggle } from 'hooks/use-toggle'; import Link from 'next/link'; import Router from 'next/router'; +import { emit } from 'process'; import React, { useCallback, useState } from 'react'; import styles from './index.module.scss'; @@ -25,7 +27,13 @@ const Page = () => { const { sendVerifyCode, loading: sendVerifyCodeLoading } = useVerifyCode(); const onFormChange = useCallback((formState) => { - setEmail(formState.values.email); + const email = formState.values.email; + + if (isEmail(email)) { + setEmail(email); + } else { + setEmail(null); + } }, []); const { start, stop } = useInterval(() => { @@ -89,6 +97,7 @@ const Page = () => { 用户注册 + { placeholder="输入账户名称" rules={[{ required: true, message: '请输入账户' }]} > + { placeholder="输入用户密码" rules={[{ required: true, message: '请输入密码' }]} > -