🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
## 表单验证 集成使用了前端验证器nice-validator https://validator.niceue.com/docs/getting-started.html 表单构建器已经集成该前端组件,可以直接使用。 ### 使用 回顾一下构建器的表单项的参数: ~~~ /** * 加入一个表单项 * @param $name 字段名 * @param $type 表单类型(取值参考系统配置form_item_type) * @param $title 表单标题 * @param $description 表单项描述说明 * @param $options 表单options * @param $extra_attr 表单项扩展属性,如表单验证 * @param $extra_class 表单项扩展class * @return $this */ function addFormItem($name, $type, $title, $description = '',$options = [],$extra_attr = '',$extra_class = '') ~~~ 其中有一个extra_attr参数,改参数是为了扩展表单输入项的属性。比如验证规则。 那么规则如何写,上例子: ~~~ ->addFormItem('email', 'text', '邮箱', '','','data-rule="email" data-tip="请填写一个邮箱地址"') ~~~ 这是一个邮箱验证的写法。 #### 要求: 1.将表单的输入框验证规则写在$extra_attr这个参数。 2.规则写法是字符串的形式。更多验证规则写法参考。 #### 针对表单元素的绑定 **配置在字段元素上** >[info] data-rule - 给字段配置规则 > data-rule-* - 给字段自定义规则 > data-msg - 字段验证不通过时的提示 > data-msg-* - 字段具体规则验证不通过时的提示 > data-tip - 字段填写帮助 > data-ok - 字段验证通过时的提示 > data-target - 配置提示消息的显示位置 > data-timely - 配置验证的实时性 (v0.8.0+) > data-must - 是否强制验证 (v0.8.0+) > novalidate - 如果配置则停止验证该字段