/antd-form-mate

基于 ant design 的表单组件,配置化实现表单功能。

Primary LanguageTypeScriptMIT LicenseMIT

antd-form-mate

GitHub license npm Version GitHub stars GitHub issues GitHub commit activity

基于 ant design 的表单组件,配置化实现表单功能。

basic.png

基础表单项

advanced.png

高级表单项

安装

npm i -S antd-form-mate

开发

基于 Storybook 开发调试。

$ git clone https://github.com/theprimone/antd-form-mate.git
$ cd antd-form-mate
$ npm install
$ npm start

使用

可配置类型

  1. custom 自定义组件类型
  2. date 日期
  3. datetime 日期时间
  4. date-range 日期范围
  5. datetime-range 日期时间范围
  6. number
  7. select
  8. textarea
  9. password
  10. picture
  11. switch
  12. slider 滑动输入
  13. file-dragger
  14. string 默认类型
  15. location 地址录入,基于高德地图
  16. check-group 多选框
  17. radio-group 单选框

API

表单项

参数 说明 类型 默认值
type 上述类型 ComponentType 'string'
field 字段名 string -
formItemProps Form.Item 支持的配置,新增 dense 属性配置 Form.Item marginBottom 为 0 扩展 FormItemProps -
fieldProps 字段值配置 GetFieldDecoratorOptions -
componentProps 额外的组件配置 ComponentProps -
component 自定义的组件,仅当 type'custom' 时可用 React.ElementType -

未尽事宜,可参考 index.stories.tsx