0.3.0 • Published 5 years ago
@rrc-materials/form v0.3.0
showNav: true
Form
@rrc-materials/form
for rrc fork element-ui form支持使用数据配置表单项,可以配置表单项为输入框、选择器、单选框、多选框等,支持收集、校验、提交数据
Form 表单
当需要收集、校验、提交数据的时候,可以使用表单组件,使用数据配置表单项
:::tip
注意: Element-UI
的属性和方法都适用。
:::
典型表单
行内表单
行内表单换行
对齐方式
全局表单验证
单行表单验证
自定义校验规则
隐藏默认底部按钮
Attributes
参数 | 说明 | 可选值 | 类型 | 默认值 |
---|---|---|---|---|
data | 需要渲染的数据 | - | Object | - |
rules | 表单验证规则 | - | Object | - |
has-footer | 是否需要底部按钮 | - | Object | - |
inline | 行内表单模式 | - | Boolean | false |
label-position | 表单域标签的位置 | right/left/top | String | right |
label-width | 表单域标签的宽度,作为 Form 直接子元素的 form-item 会继承该值 | - | String | - |
label-suffix | 表单域标签的后缀 | - | String | - |
show-message | 是否显示校验错误信息 | - | Boolean | true |
status-icon | 是否在输入框中显示校验结果反馈图标 | - | Boolean | false |
reset-button | 是否显示重置按钮 | - | Boolean | false |
confirm-button-text | 确认按钮文案 | - | String | 确认 |
hasFooter | 是否有底部按钮组 | - | Boolean | true |
... | 其他属性请看 ElementUI文档 | - | - | - |
Events
事件名称 | 说明 | 回调参数 |
---|---|---|
validate | 任一表单项被校验后触发 | 被校验的表单项 prop 值,校验是否通过 |
Methods
方法名 | 说明 | 参数 |
---|---|---|
validate | 对整个表单进行校验的方法,参数为一个回调函数。该回调函数会在校验结束后被调用,并传入两个参数:是否校验成功和未通过校验的字段。若不传入回调函数,则会返回一个 promise | Function(callback: Function(boolean, object)) |
validateField | 对部分表单字段进行校验的方法 | Function(prop: string, callback: Function(errorMessage: string)) |
0.3.0
5 years ago
0.2.3
5 years ago
0.2.2
5 years ago
0.2.0
5 years ago
0.1.0
5 years ago
0.0.1-beta.22
5 years ago
0.0.1-beta.21
5 years ago
0.0.1-beta.20
5 years ago
0.0.1-beta.19
5 years ago
0.0.1-beta.18
6 years ago
0.0.1-beta.17
6 years ago
0.0.1-beta.15
6 years ago
0.0.1-beta.14
6 years ago
0.0.1-beta.13
6 years ago
0.0.1-beta.12
6 years ago
0.0.1-beta.11
6 years ago
0.0.1-beta.10
6 years ago
0.0.1-beta.9
6 years ago
0.0.1-beta.8
6 years ago
0.0.1-beta.7
6 years ago
0.0.1-beta.6
6 years ago