可以生成 Vue 自定义组件的 PHP 表单生成器,支持 IView 和 ElementUI
FormBuilder
FormBuilder 是一个开源的PHP表单生成器,可以快速生成现代化的form表单。还可以配合开源项目 xaboy/form-create 生成任何 Vue 组件
环境需求
- PHP >= 5.4
安装
使用 composer:
$ composer require xaboy/form-builder:~2.0
文档
支持 UI
- IView
- ElementUI
功能介绍
- 内置17种常用的表单组件
- 支持表单验证
- 支持生成任何 Vue 组件
- 支持栅格布局
- 可以配合 form-create 生成更复杂的表单
生成表单
以 ElementUI 为例,用法如下:
use FormBuilder\Factory\Elm;
$action = '/save.php';
$method = 'POST';
$input = Elm::input('goods_name', '商品名称')->required();
$textarea = Elm::textarea('goods_info', '商品简介');
$switch = Elm::switches('is_open', '是否开启')->activeText('开启')->inactiveText('关闭');
//创建表单
$form = Elm::form($action)->setMethod($method);
//添加组件
$form->setRule([$input, $textarea]);
$form->append($switch);
//生成表单页面
echo $formHtml = $form->view();
表单验证
必填
所有内置组件都支持 required 验证
$input = Elm::input('goods_name','商品名称');
//必填
$input->required();
创建一个必填的验证规则
//input 组件值得类型为 string
$validate = Elm::validateStr();
$validate->required()->message('请填写商品名称');
$input->appendValidate($validate);
//$input->appendValidates([$validate]);
//$input->validate([$validate]) //这个会覆盖刚刚添加的必填规则
获取组件类型对应的验证规则
所有内置组件都支持通过 createValidate 方法获取组件的验证规则,注意:一个组件的验证规则可能有多个类型,要把组件所有的规则配置完后再获取
$start = date('Y-m-d', strtotime('- 10day'));
$end = date('Y-m-d', time());
$dateRange = Elm::dateRange('start_time','时间区间', $start, $end);
$validate = $dateRange->createValidate();
长度或值必须在这个范围内
$validate->range(1,10);
长度或值必须大于这个值
$validate->min(1);
长度或值必须小于这个值
$validate->max(10);
长度或值必须等于这个值
$validate->length(10);
值必须在 list 中
$list = [1,2,3,4];
$validate->enum($list);
正则验证
$validate->pattern('^[A-Z]+$');
验证未通过错误信息
$validate->message('输入有误');
创建规则
string
类型
$validate = Elm::validateStr();
//email
$validate = Elm::validateEmail();
//url
$validate = Elm::validateUrl();
array
类型
$validate = Elm::validateArr();
int
类型
$validate = Elm::validateInt();
float
类型
$validate = Elm::validateFloat();
float|int
类型
$validate = Elm::validateNum();
Date
类型
例如DatePicker
,TimePicker
$validate = Elm::validateDate();
object
类型
$validate = Elm::validateObject();
枚举类型
$validate = Elm::validateEnum()->enum(['1','2','3']);
hex类型
$validate = Elm::validateHex();
触发方式
change
值发生变化时触发验证,默认
blur
组件失去焦点时触发
submit
表单提交时触发
本作品采用《CC 协议》,转载必须注明作者和本文链接
推荐文章: