0.1.2 • Published 10 years ago
react-weui-form v0.1.2
react-weui-form
weui-react快速表单创建
Demo

使用
npm安装
npm install react-weui-formreact倒入
import WeForm from 'react-weui-form'定义表单
//定义架构
let schema = [
//一个新的列表组
{
label:'基本资料',
properties:[
//表单单位定义
//创建一个文本输入,验证为2到15为字符
{
id:'username',
label:'用户名',
default:'',
type:'text',
placeholder:'2到15位字符',
rule:'required|between:2,15|string'
},
{
id:'password',
label:'密码',
type:'password',
placeholder:'输入您的密码',
rule:'required'
}
]
}
];
//定义设置
let form = {
//定义按钮
actions:[
{
label:'登陆',
type:'primary',
onClick :(data)=>alert(JSON.stringify(data,null,2)),
}
]
};输出React组件
<WeForm schema={schema} form={form}/>#可用type text,password,number,date,datetime,textarea,select,checkbox #可用验证rule 用法
rule:'required|between:2,15'| 类别 | 属性 |
|---|---|
| required | |
| string | |
| number | |
| date | mindateoptional,maxdateoptional |
| datetime | mindateoptional,maxdateoptional |
| between | minoptional,maxoptional |