如何用正则验证以@pin.edu.sh结尾的邮箱？（React Hook Form场景）

开发者阿泽

2026-8-5

解决邮箱必须以@pin.edu.sh结尾的验证问题

你的正则表达式存在几个问题，导致无法正确校验邮箱后缀：

pin+ 会匹配「pin」「pinn」「pinnn」等多个n的情况，不符合固定后缀的要求
[.]+ 会匹配一个或多个连续的点，比如@pin..edu.sh这种非法格式也会被通过
用户名部分的规则限制过严，标准邮箱用户名支持更多合法字符（比如+、-）

修正后的正则表达式

使用这个更精准的正则，既能匹配合法的邮箱用户名，又能严格限定后缀为@pin.edu.sh：

const validEmail = /^[a-zA-Z0-9_.+-]+@pin\.edu\.sh$/

^[a-zA-Z0-9_.+-]+：匹配邮箱用户名部分，覆盖所有常见的合法邮箱字符
@pin\.edu\.sh$：用转义的\.匹配实际的点，$确保字符串必须以此后缀结尾，没有多余字符

调整后的表单代码

同时建议把错误提示修改得更明确，让用户清楚知道要求：

const validEmail = /^[a-zA-Z0-9_.+-]+@pin\.edu\.sh$/

<TextField   
    variant="outlined"
    name="email"
    label="Email"
    required
    fullWidth
    type="email"
    autoComplete='email'
    {...register('email', {
        required: "Required", 
        pattern: {
            value: validEmail, 
            message: "邮箱必须以@pin.edu.sh结尾" 
        }
    })}
    error={!!errors?.email}
    helperText={errors?.email ? errors.email.message : null}
/>

这样修改后：