validate-utils-esm

ESM 表单验证工具库，提供13个常用的验证函数，支持在任何支持ESM的框架中使用。

安装

npm install validate-utils-esm

特性

• ✅ ESM模块化设计，支持按需导入
• ✅ 零依赖，体积小，性能好
• ✅ 跨框架兼容（Vue、React、Angular等）
• ✅ 类型安全，提供清晰的函数签名
• ✅ 易于扩展和维护

验证函数列表

| 函数名 | 说明 | |--------|------| | isEmail | 验证邮箱格式 | | isPhone | 验证手机号（支持中国大陆和国际号码） | | isUrl | 验证URL格式 | | isIP | 验证IPv4/IPv6地址 | | isIdCard | 验证身份证号（支持18位） | | isPostalCode | 验证邮政编码（中国大陆6位） | | isStrongPassword | 验证强密码（至少包含大小写字母、数字、特殊字符，长度≥8） | | isNumber | 验证是否为数字（支持整数、浮点数） | | isInt | 验证是否为整数 | | isFloat | 验证是否为浮点数 | | isLength | 验证字符串长度是否在指定范围内 | | isBetween | 验证数字是否在指定区间内 | | matches | 正则表达式匹配验证（通用） |

使用示例

基本使用

// 导入所有验证函数
import * as validate from 'validate-utils-esm';

// 或按需导入
import { isEmail, isPhone } from 'validate-utils-esm';

// 使用验证函数
validate.isEmail('[email protected]'); // true
validate.isPhone('13812345678'); // true
validate.isStrongPassword('Abc123!@#'); // true

在Vue中使用

<template><form><input v-model="email" placeholder="邮箱" /><div>{{ isEmail(email) ? '✓' : '✗' }}</div><input v-model="password" placeholder="密码" /><div>{{ isStrongPassword(password) ? '✓' : '✗' }}</div><button type="submit" [disabled]="!isEmail(email) || !isStrongPassword(password)">提交</button></form></template><script setup>
import { ref } from 'vue';
import { isEmail, isStrongPassword } from 'validate-utils-esm';

const email = ref('');
const password = ref('');
</script>

在React中使用

import React, { useState } from 'react';
import { isEmail, isPhone } from 'validate-utils-esm';

function Form() {
  const [email, setEmail] = useState('');
  
  const handleSubmit = (e) => {
    e.preventDefault();
    if (isEmail(email)) {
      console.log('邮箱有效');
    }
  };
  
  return (<form onSubmit={handleSubmit}><input
        value={email}
        onChange={(e) =>setEmail(e.target.value)}
        placeholder="邮箱"
      /><div>{isEmail(email) ? '✓' : '✗'}</div><button type="submit">提交</button></form>);
}

在Angular中使用

import { Component } from '@angular/core';
import { isEmail, isPhone } from 'validate-utils-esm';

@Component({
  selector: 'app-form',
  template: `
    <form>
      <input [(ngModel)]="email" placeholder="邮箱" />
      <div>{{ isEmail(email) ? '✓' : '✗' }}</div>
      
      <input [(ngModel)]="phone" placeholder="手机号" />
      <div>{{ isPhone(phone) ? '✓' : '✗' }}</div>
    </form>
  `
})
export class FormComponent {
  email = '';
  phone = '';
  
  isEmail = isEmail;
  isPhone = isPhone;
}

API文档

isEmail(email: string): boolean

验证邮箱格式是否正确。

isPhone(phone: string, international?: boolean): boolean

验证手机号格式。international 参数为 true 时支持国际号码。

isUrl(url: string): boolean

验证URL格式是否正确。

isIP(ip: string): boolean

验证IPv4或IPv6地址格式。

isIdCard(idCard: string): boolean

验证18位身份证号格式。

isPostalCode(postalCode: string): boolean

验证中国大陆6位邮政编码。

isStrongPassword(password: string): boolean

验证强密码（至少包含大小写字母、数字、特殊字符，长度≥8）。

isNumber(value: string | number): boolean

验证是否为数字（整数或浮点数）。

isInt(value: string | number): boolean

验证是否为整数。

isFloat(value: string | number): boolean

验证是否为浮点数。

isLength(str: string, min: number, max: number): boolean

验证字符串长度是否在指定范围内。

isBetween(value: string | number, min: number, max: number): boolean

验证数字是否在指定区间内。

matches(value: string, regex: RegExp | string): boolean

使用正则表达式匹配验证字符串。

许可证

MIT