§ fox-group 组
§ HTML
<fox-group no="1" title="四列+跨列" column="4" title-width="10rem" color="#e60012">
<fox-text placeholder="请输入内容">普通</fox-text>
<fox-text placeholder="请输入内容" :disabled="true">禁用</fox-text>
<fox-number placeholder="请输入内容">数字框</fox-number>
<fox-money placeholder="请输入内容">金额框</fox-money>
<fox-password>密码框</fox-password>
<fox-pop-select v-model="sel_val" :source="m_select_items" span="3">弹出选择</fox-pop-select>
</fox-group>
<fox-group no="2" title="三列+跨列+校验" column="3" title-width="10rem" color="#e60012">
<fox-text v-verify="'require'" v-model="value" placeholder="请输入内容">必输</fox-text>
<fox-text v-verify="['require','email']" v-model="value2" placeholder="请输入内容">邮件</fox-text>
<fox-text v-verify="['require','url']" v-model="value3" placeholder="请输入内容">URL</fox-text>
<fox-text v-verify="['require','number']" v-model="value4" type="number" placeholder="请输入内容">数字</fox-text>
<fox-text v-verify="[{'require':true},{range:[5,10]}]" v-model="value5" placeholder="请输入内容" span="2" >5~10之间</fox-text>
</fox-group>
<fox-group no="3" title="二列+行" column="2" title-width="10rem" color="#e60012">
<fox-text placeholder="请输入内容" disabled>禁用</fox-text>
<fox-text placeholder="请输入内容" readonly>只读</fox-text>
<fox-textarea placeholder="请输入内容" type="textarea" span="2">多行文本框</fox-textarea>
</fox-group>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
§ API
§ Props
组件支持以下属性：
| 参数 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| disabled | disabled(全局) | Boolean/String | — |
| readonly | 是否可读(全局) | Boolean/String | — |
| filter-models | 可读/禁用不处理model集合(全局) | Array | — |
| column | 列数 | Number/String | — |
| name | 组名 | String | — |
| no | 序号 | String/Number | — |
| title | 标题 | String | — |
| color | 颜色 | String | — |
| span | 跨列数 | Number/String | 1 |
| sub | 是否为孩子group | Boolean/String | false |
no和name其中一个不设置，那么group的header将不会显示
§ Slots
支持以下插槽：
| 名称 | 说明 |
|---|---|
| default | item内容 |