npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

kn-rule

v0.0.8

Published

常用数据校验规则,描述方式使用了[antd的rule规则](https://ant.design/components/form-cn/#Rule)

Downloads

19

Readme

kn-rule

常用数据校验规则,描述方式使用了antd的rule规则

所有校验都增加了xss攻击校验排除script标签

使用方法

npm i kn-rule

方法一:脱离antd单独使用

import Rule,{validate} from 'kn-rule';
// 假设当输入时需要校验用户输入是整形数字的话
const onInput=async ()=>{
  let req = await validate(value,Rule.NUMBER);
  if(req.success){
    alert('success');
  }else{
    alert(req.message);
  }
}

方法二:配合antd使用

import {Form,Input} from 'antd';
import Rule from 'kn-rule';

const Index=()=>{
  return (
    <Form>
      <Form.Item  label="数字" rules={Rule.NUMBER}>
        <Input />
      </Form.Item>
    </Form>
  )
}

目前支持校验类型

INPUT: 普通字符串输入(去掉字符串收尾空格后,长度不能超过128位),
INPUT_NR: 同上但是非必填,
SELECT: 用于选择项,
UPLOAD: 上传文件,
TEXTAREA: 富文本框(长度不能超过20480位),
NUMBER: 整形数字(不能带小数点),(长度不能超过12位),
NUMBER_NR: 同上但是非必填,
TITLE: 标题(长度不能超过32位),
FLOAT: 浮点数字(数字可以带小数,小数点后最长5位,总长度不能超过12位),
LINK: 链接(长度不能超过1024位),
LINK_NR: 同上但是非必填,
PWD: 密码(6-16位字母、下划线、数字任意组合的字符),
PWD_NR: 同上但是非必填,
ACCOUNT: 账号(1-12位字母、下划线、数字任意组合的字符),
ACCOUNT_NR: 同上但是非必填,
NICKNAME: 昵称(2-16为可见字符),
NICKNAME_NR: 同上但是非必填,
PHONE: 手机号,
PHONE_NR: 同上但是非必填,
WEIGHT: 权重(0~4位数字组成),
WEIGHT_NR: 同上但是非必填,

自定义规则-CUSTOM动态规则生成器

通过引入 CUSTOM 对象下的生成器,可以动态生成自定义的校验规则

import Rule,{CUSTOM} from 'kn-rule';
const onInput=async ()=>{
  let req = await validate(value,CUSTOM.INPUT({min:1,max:10,noSpace:true}));
  if(req.success){
    alert('success');
  }else{
    alert(req.message);
  }
}

CUSTOM动态规则生成器

  • INPUT - 针对常规输入框 配置|类型|描述 :--|:--|:-- min|number|最小字符长度 max|number|最大字符长度 noSpace|boolean|不得存在任何空格,默认情况下字符串的中间允许存在空格 required|boolean|是否必填

  • NUMBER - 针对数字输入框 配置|类型|描述 :--|:--|:-- min|number|最小数字值 max|number|最大数字值 required|boolean|是否必填

版本更新日志

  • 0.0.7
    修复必填校验在对null、undefined、NaN校验时判断为非空的问题