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 🙏

© 2026 – Pkg Stats / Ryan Hefner

@ivliu/async-form-antd

v0.3.0

Published

通过自定义的formSchema结构,自动生成表单

Downloads

43

Readme

API

  1. formSchema: object
{
  "title": "normal",
  "description": "desc",
  "fields": [
    {
      "field": "username",
      "name": "用户名",
    },
    {
      "field": "password",
      "name": "密码",
    },
  ]
}
  1. formDate: object
  {
    "username": "ivliu",
    "password": "123456"
  }
  1. callback: (val: any) => void 回调函数,其中val参数是要提交的值

  2. submitTxt: string 提交按钮的文案

说明

下面介绍每个字段的意义以及取值。

  1. title (string) 标题
  2. description (string) 描述
  3. required (array) 必填字段枚举,数组项可以是字符串或者数组
    1. 字符串:必须字段的field值
    2. *数组: 第一项是必需字段的field值,第二项是自定义警告信息(参照antd),更多项将被忽略
  4. fields (array) 表单字段枚举 #field配置介绍#
  5. *modal (0 | 1) 是否需要展示在modal中,还需研究
field配置介绍
  1. field (string) 字段名 非空
  2. name (string) 标签名称
  3. widget (string) 组件名称 默认Input
  4. type (string) 类型 [string, array, number, boolean, object]
  5. enum (array) 枚举值,一般配合Select,Radio或者CheckBox使用,数组项是数组
    1. 数组的第一项是对应的提交值,第二项是相应的UI文案
  6. tips (string) 自定义文案提示,多用于palaceholder
  7. tabs: (array) 支持tab切换设置数组类型的field, type是array时应用
  8. by (string) 如果有依赖,定义依赖的field
  9. ref (string | array) 自定义形状,一般用于数组项的自定义,数组项可以是字符串或者数组
    1. 字符串:对应的ref值
    2. 数组:用于有前后依赖时
  10. defaultValue (string | array | number | boolean | object) 默认值
  11. txt (string) 目前作用还未想好,目前是为了兼容CheckBox和Radio不包含enum的时候
  12. *api (string) 针对有网络请求的Select,Radio或者其他组件的情况
  13. *optFields (array) 命名还需改正,对应接口中的字段
  14. *thirdWidget (string) 第三方组件支持
  • 表示有待调整

Demo(待完善)