easyform

基于antd二次封装的表单管理组件

功能特性

1、label和表单元素支持上下、左右排列

2、支持编辑、预览、禁用等几种模式

3、支持根据依赖字段动态加载options

4、表单右侧和底部支持显示扩展信息

5、支持根据依赖字段显示和隐藏

安装

npm install --save https://github.com/SunXingZ/easyform.git or yarn add https://github.com/SunXingZ/easyform.git

API

参数	说明	类型	默认值	示例
name	Form.Item的name属性	string	-	-
label	Form.Item的label属性	ReactNode	-	-
preview	表单预览模式	boolean | ReactNode | ({ value, options, elementType }) => ReactNode	-	-
elementType	表单类型	string	-	'input'
elementProps	作用于表单元素的props，例如：disabled，placeholder等	object	{}	-
itemProps	作用于Form.item的props，例如：rules，extra等	object	{}	{ rules: [ { required: true, message: '请输入' } ] }
options	当elementType为select，radio，checkbox等类型时需要配置	string | array | object，为string时作为接口地址。为array时作为options选项。为object时object.url作为接口地址。object.dataKey为数据在response中的名称，例如：response = { status: 200, data: [] } 则dataKey应配置为'data'，默认'data'。 object.labelKey指定option.label取值，默认'name'。object.valueKey指定option.value如何取值，默认'id'。	[]	详见：example下App.js中的示例
rightExtra	表单右侧显示的信息	ReactNode	-	获取验证码
description	表单底部显示的信息，位于Form.item的extra下	ReactNode	-	一段描述信息
shouldUpdate	此属性会覆盖Form.Item的shouldUpdate，作为控制表单显示隐藏的配置。	object	{}	{ age: 18, type: [1, 2] } 表示age字段值为18且type字段值为1或2时表单会显示，否则隐藏。

温馨提示

这个库目前还在开发中，随时可能发生重大变动，如使用请谨慎。

License

MIT © SunXingZ