Javascript 如何删除默认的html邮件错误消息，并使Zod消息改为react 挂钩形式

这是我的图式.使用Reaction-Hook-Form&amp；Zod进行验证

const emailInputSchema = z.object({
  email: z.string().min(1, "input is required").email("email address is not valid"),
});

我希望显示消息"邮箱地址无效"，而不是标准的邮箱错误消息:

我想要"需要输入"，但我在Error对象中没有得到这个错误.

  const {
    register,
    handleSubmit,
    formState: { errors, isSubmitting },
    reset,
  } = useForm<TEmailInputSchema>({
    resolver: zodResolver(emailInputSchema, { errorMap: customErrorMap }),
  });

以下是多伦多证券交易所内部的表单:

      <form onSubmit={handleSubmit(handleMailSubmit)}>
        <div className="input-container">
          <div className="input-wrapper rounded">
            <FaRegEnvelope className="input-icon" />
            <input
              type="email"
              {...register("email")}
              placeholder="email"
              className="input"
              autoComplete="email"
            />
          </div>
        </div>
        {errors.email && (
          <p className={`${errorStyle}`}>{`${errors.email.message}`}</p>
        )}
        <div className="buttons-container">
          <button
            type="submit"
            disabled={isSubmitting}
            className="form-submit-button"
          >
            Send an email
          </button>
        </div>
      </form>