一.组件参数说明
- field: 组件key值/字段
- value: 组件值
- type: 组件类型 (input,select,radio,switch,pipeline自定义组件)
- title: 表单行label值
-
props:
- 支持mtd组件所有基础属性
- 参数:Object
-
event:
- 组件事件配置
- 参数 Object
-
validate:
- 组件验证规则配置
- 参数 Array
-
options:
- 部分组件option选择项配置
- 参数 Array
-
className:
- 参数: Object | Array | string
- 自定义组件的样式
-
col
- 组建栅格布局
- Object
二. 组件实例
-
input组件
-
props支持参数(支持全部mtd组件Attributes中属性,选择重要配置项说明)
参数 说明 类型 可选值 默认值 size 选择框尺寸 string small、normal、large normal clearable 是否有清空按钮 boolean true、false false disabled 是否禁用 boolean false readonly 只读 boolean { field:'', // 组件绑定key值 title:'',// 组件lable值 value:'',// 组件value值 type:'input', props:{ // 可配置mtd组件上全部属性 disabled:true / false }, validate:[{type: "string", required: fasle, pattern: ".*"}] // 校验规则, }
-
select组件
-
注意:value为select 当前选中值, 多选时为数组。注意value的数据格式应与options中value格式相同,不能出现‘123‘和123此类的数据
参数 | 说明 | 类型 | 可选值 | 默认值 |
---|---|---|---|---|
size | 选择框尺寸 | string | small、normal、large | normal |
clearable | 是否有清空按钮 | boolean | true、false | false |
disabled | 是否禁用 | boolean | false | |
readonly | 只读 | boolean | ||
multiple | 多选 | boolean | false | |
clearable | 清空 | boolean | ||
show-checkbox | 多选是否展示 Checkbox,仅当设置 multiple 属性时生效 | boolean |
{
type: "select",
field: "cate_id",
title: "产品分类",
value: '',
api: {
url: '',
methods:'' // get post
},// 代理前缀及地址不需要返回
options: [
{"value": "104", "label": "生态蔬菜", "disabled": false},
{"value": "105", "label": "新鲜水果", "disabled": false},
],
props: {
filterable: false, // 是否可搜索
remote-method:'',// 默认搜索必须远程,绑定方法,本地实现,非模糊查询时为空即可
clearable:false, // 是否可清空
},
validate:[{type: "string", required: fasle, pattern: ".*"}] // 校验规则,
}
-
radio
{ type:"notifier", title:"添加通知人", field:"is_postage", value:[{name:'abc',mis:'abc01'}], // value为数组,分为name和mis两项 validate:[{type: "string", required: fasle, pattern: ".*"}] // 校验规则 }