commit
ea03749a5c
|
@ -1,22 +1,18 @@
|
|||
---
|
||||
title: AMis 渲染器手册
|
||||
---
|
||||
|
||||
AMis 页面是通过 Json 配置出来的,是由一个一个渲染模型组成的,掌握他们规则,就能灵活配置出各种页面。
|
||||
### 渲染器手册
|
||||
|
||||
AMis 页面是通过 JSON 配置出来的,是由一个一个渲染模型组成的,掌握他们规则,就能灵活配置出各种页面。
|
||||
|
||||
- [Page](./renderers/Page.md): JSON 配置最外层的 Page 渲染器
|
||||
- [Form](./renderers/Form.md): 表单渲染器
|
||||
|
||||
- [FormItem](./renderers/FormItem.md): Form 中主要是由各种 FormItem 组成
|
||||
- [FormItem-List](./renderers/FormItem-List.md): 简单的列表选择框
|
||||
- [FormItem-Button-Group](./renderers/FormItem-Button-Group.md): 按钮集合
|
||||
- [FormItem-Service](./renderers/FormItem-Service.md): 动态配置,配置项由接口决定
|
||||
- [FormItem-Tabs](./renderers/FormItem-Tabs.md): 多个输入框通过选项卡来分组
|
||||
- [FormItem-Table](./renderers/FormItem-Table.md): 可以用来展示数组类型的数据
|
||||
- [FormItem-HBox](./renderers/FormItem-HBox.md): 支持 form 内部再用 HBox 布局
|
||||
- [FormItem-Grid](./renderers/FormItem-Grid.md): 支持 form 内部再用 grid 布局
|
||||
- [FormItem-Panel](./renderers/FormItem-Panel.md): 还是为了布局,可以把一部分 FormItem 合并到一个 panel 里面单独展示
|
||||
- [FormItem-List](./renderers/FormItem-List.md): 简单的列表选择框
|
||||
- [FormItem-Button-Group](./renderers/FormItem-Button-Group.md): 按钮集合
|
||||
- [FormItem-Service](./renderers/FormItem-Service.md): 动态配置,配置项由接口决定
|
||||
- [FormItem-Tabs](./renderers/FormItem-Tabs.md): 多个输入框通过选项卡来分组
|
||||
- [FormItem-Table](./renderers/FormItem-Table.md): 可以用来展示数组类型的数据
|
||||
- [FormItem-HBox](./renderers/FormItem-HBox.md): 支持 form 内部再用 HBox 布局
|
||||
- [FormItem-Grid](./renderers/FormItem-Grid.md): 支持 form 内部再用 grid 布局
|
||||
- [FormItem-Panel](./renderers/FormItem-Panel.md): 还是为了布局,可以把一部分 FormItem 合并到一个 panel 里面单独展示
|
||||
- [Hidden](./renderers/Hidden.md): 隐藏字段类型
|
||||
- [Text](./renderers/Text.md): 普通的文本输入框
|
||||
- [Textarea](./renderers/Textarea.md): 多行文本输入框
|
||||
|
@ -56,7 +52,6 @@ AMis 页面是通过 Json 配置出来的,是由一个一个渲染模型组成
|
|||
- [Rich-Text](./renderers/Rich-Text.md): 富文本编辑器
|
||||
- [Editor](./renderers/Editor.md): 编辑器
|
||||
- [Static](./renderers/Static.md): 纯用来展现数据的
|
||||
|
||||
- [Wizard](./renderers/Wizard.md): 表单向导
|
||||
- [Tpl](./renderers/Tpl.md): 支持用 JS 模板引擎来组织输出
|
||||
- [Plain](./renderers/Plain.md): 单纯的文字输出
|
||||
|
@ -89,4 +84,4 @@ AMis 页面是通过 Json 配置出来的,是由一个一个渲染模型组成
|
|||
- [Nav](./renderers/Nav.md): 菜单栏
|
||||
- [Tasks](./renderers/Tasks.md): 任务操作集合,类似于 orp 上线
|
||||
- [QRCode](./renderers/QRCode.md): 二维码显示组件
|
||||
- [类型说明](./renderers/Types.md): 类型说明文档
|
||||
- [Types](./renderers/Types.md): 类型说明文档
|
||||
|
|
|
@ -4,14 +4,14 @@ Action 是一种特殊的渲染器,它本身是一个按钮,同时它能触
|
|||
|
||||
- `type` 指定为 `button`。
|
||||
- `actionType` 【必填】 选项:`ajax`、`link`、`url`、`dawer`、`dialog`、`confirm`、`cancel`、`prev`、`next`、`copy` 或者 `close`。
|
||||
- `api` 当 `actionType` 为 `ajax` 时,必须指定,参考 [api](#api) 格式说明。
|
||||
- `api` 当 `actionType` 为 `ajax` 时,必须指定,参考 [api](./Types.md#Api) 格式说明。
|
||||
- `link` 当 `actionType` 为 `link` 时必须指定,用来指定跳转地址,跟 url 不同的是,这是单页跳转方式,不会渲染浏览器,请指定 AMis 平台内的页面。
|
||||
- `url` 当 `actionType` 为 `url` 时必须指定,按钮点击后,会打开指定页面。
|
||||
- `blank` 当 `actionType` 为 `url` 时可选,如果为 false 将在本页面打开。
|
||||
- `dialog` 当 `actionType` 为 `dialog` 时用来指定弹框内容。
|
||||
- `dawer` 当 `actionType` 为 `drawer` 时用来指定抽出式弹框内容。
|
||||
- `copy` 当 `actionType` 为 `copy` 时用来指定复制的内容。
|
||||
- `nextCondition` 当 `actionType` 为 `dialog` 时可以用来设置下一条数据的条件,默认为 `true`。详情请见 [Demo](/docs/demo/crud/next)。
|
||||
- `nextCondition` 当 `actionType` 为 `dialog` 时可以用来设置下一条数据的条件,默认为 `true`。
|
||||
- `confirmText` 当设置 `confirmText` 后,操作在开始前会询问用户。
|
||||
- `reload` 指定此次操作完后,需要刷新的目标组件名字(组件的 name 指,自己配置的),多个请用 `,` 号隔开。
|
||||
- `feedback` 如果 ajax 类型的,当 ajax 返回正常后,还能接着弹出一个 dialog 做其他交互。返回的数据可用于这个 dialog 中。
|
||||
|
@ -69,7 +69,7 @@ Action 是一种特殊的渲染器,它本身是一个按钮,同时它能触
|
|||
}
|
||||
```
|
||||
|
||||
- `dialog` 当按钮点击后,弹出一个对话框。 关于 dialog 配置,请查看 [Dialog 模型](#dialog)。
|
||||
- `dialog` 当按钮点击后,弹出一个对话框。 关于 dialog 配置,请查看 [Dialog 模型](./Dialog.md)。
|
||||
|
||||
```schema:height="200"
|
||||
{
|
||||
|
@ -96,7 +96,7 @@ Action 是一种特殊的渲染器,它本身是一个按钮,同时它能触
|
|||
}
|
||||
```
|
||||
|
||||
- `drawer` 当按钮点击后,弹出一个抽出式对话框。 关于 drawer 配置,请查看 [Drawer 模型](#drawer)。
|
||||
- `drawer` 当按钮点击后,弹出一个抽出式对话框。 关于 drawer 配置,请查看 [Drawer 模型](./Drawer.md)。
|
||||
|
||||
```schema:height="200"
|
||||
{
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
|
||||
数组输入框配置
|
||||
|
||||
其实就是 [Combo](#combo) 的一个 flat 用法。
|
||||
其实就是 [Combo](./Combo.md) 的一个 flat 用法。
|
||||
|
||||
- `type` 请设置成 `array`
|
||||
- `items` 配置单项表单类型
|
||||
|
@ -13,7 +13,7 @@
|
|||
- `addButtonText` 新增按钮文字,默认为 `"新增"`。
|
||||
- `minLength` 限制最小长度。
|
||||
- `maxLength` 限制最大长度。
|
||||
- 更多配置请参考 [FormItem](#FormItem)
|
||||
- 更多配置请参考 [FormItem](./FormItem.md)
|
||||
|
||||
```schema:height="450" scope="form"
|
||||
[
|
||||
|
|
|
@ -9,7 +9,7 @@
|
|||
- `size` 按钮大小。 包含: `xs`、`sm`、`md`和`lg`
|
||||
- `className` 按钮的类名。
|
||||
|
||||
如果按钮是 `button` 类型,则还需要配置 [Action](#action) 中定义的属性,否则,AMis 不知道如何响应当前按钮点击。
|
||||
如果按钮是 `button` 类型,则还需要配置 [Action](./Action.md) 中定义的属性,否则,AMis 不知道如何响应当前按钮点击。
|
||||
|
||||
```schema:height="300" scope="form"
|
||||
[
|
||||
|
|
|
@ -1,11 +1,11 @@
|
|||
### Cards(CRUD)
|
||||
|
||||
请参考[Cards](#cards)
|
||||
请参考[Cards](./Cards.md)
|
||||
|
||||
```schema:height="800" scope="body"
|
||||
{
|
||||
"type": "crud",
|
||||
"api": "/api/mock2/crud/users",
|
||||
"type": "Action.md",
|
||||
"api": "/api/mock2/Action.md/users",
|
||||
"syncLocation": false,
|
||||
"mode": "cards",
|
||||
"defaultParams": {
|
||||
|
|
|
@ -1,11 +1,11 @@
|
|||
### List(CRUD)
|
||||
|
||||
请参考[List](#list)
|
||||
请参考[List](./List.md)
|
||||
|
||||
```schema:height="800" scope="body"
|
||||
{
|
||||
"type": "crud",
|
||||
"api": "/api/mock2/crud/permissions",
|
||||
"type": "Action.md",
|
||||
"api": "/api/mock2/Action.md/permissions",
|
||||
"mode": "list",
|
||||
"placeholder": "当前组内, 还没有配置任何权限.",
|
||||
"syncLocation": false,
|
||||
|
|
|
@ -1,12 +1,12 @@
|
|||
### Table(CRUD)
|
||||
|
||||
在 CRUD 中的 Table 主要增加了 Column 里面的以下配置功能,更多参数,请参考[Table](#table)
|
||||
在 CRUD 中的 Table 主要增加了 Column 里面的以下配置功能,更多参数,请参考[Table](./Table.md)
|
||||
|
||||
- `sortable` 开启后可以根据当前列排序(后端排序)。
|
||||
|
||||
```schema:height="800" scope="body"
|
||||
{
|
||||
"type": "crud",
|
||||
"type": "Action.md",
|
||||
"api": "/api/sample",
|
||||
"syncLocation": false,
|
||||
"title": null,
|
||||
|
|
|
@ -1,39 +1,39 @@
|
|||
### CRUD
|
||||
|
||||
增删改查模型,主要用来展现列表,并支持各类【增】【删】【改】【查】的操作。复杂示例请前往 [Demo](/docs/demo/crud/table)。
|
||||
增删改查模型,主要用来展现列表,并支持各类【增】【删】【改】【查】的操作。
|
||||
|
||||
CRUD 支持三种模式:`table`、`cards`、`list`,默认为 `table`。
|
||||
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| ------------------------- | -------------------------- | ------------------------------- | ----------------------------------------------------------------------------------------- |
|
||||
| type | `string` | | `"crud"` 指定为 CRUD 渲染器 |
|
||||
| mode | `string` | `"table"` | `"table" 、 "cards" 或者 "list"` |
|
||||
| title | `string` | `""` | 可设置成空,当设置成空时,没有标题栏 |
|
||||
| className | `string` | | 表格外层 Dom 的类名 |
|
||||
| api | [Api](#api) | | CRUD 用来获取列表数据的 api。[详情](/docs/api#crud) |
|
||||
| filter | [Form](#form) | | 设置过滤器,当该表单提交后,会把数据带给当前 crud 刷新列表。 |
|
||||
| initFetch | `boolean` | `true` | 是否初始化的时候拉取数据, 只针对有 filter 的情况, 没有 filter 初始都会拉取数据 |
|
||||
| interval | `number` | `3000` | 刷新时间(最低 3000) |
|
||||
| silentPolling | `boolean` | `false` | 配置刷新时是否显示加载动画 |
|
||||
| stopAutoRefreshWhen | `string` | `""` | 通过[表达式](#表达式)来配置停止刷新的条件 |
|
||||
| syncLocation | `boolean` | `true` | 是否将过滤条件的参数同步到地址栏 |
|
||||
| draggable | `boolean` | `false` | 是否可通过拖拽排序 |
|
||||
| itemDraggableOn | `boolean` | | 用[表达式](#表达式)来配置是否可拖拽排序 |
|
||||
| saveOrderApi | [Api](#api) | | 保存排序的 api。[详情](/docs/api#crud) |
|
||||
| quickSaveApi | [Api](#api) | | 快速编辑后用来批量保存的 API。[详情](/docs/api#crud) |
|
||||
| quickSaveItemApi | [Api](#api) | | 快速编辑配置成及时保存时使用的 API。[详情](/docs/api#crud) |
|
||||
| bulkActions | Array Of [Action](#action) | | 批量操作列表,配置后,表格可进行选中操作。 |
|
||||
| defaultChecked | `boolean` | `false` | 当可批量操作时,默认是否全部勾选。 |
|
||||
| messages | `Object` | | 覆盖消息提示,如果不指定,将采用 api 返回的 message |
|
||||
| messages.fetchFailed | `string` | | 获取失败时提示 |
|
||||
| messages.saveOrderFailed | `string` | | 保存顺序失败提示 |
|
||||
| messages.saveOrderSuccess | `string` | | 保存顺序成功提示 |
|
||||
| messages.quickSaveFailed | `string` | | 快速保存失败提示 |
|
||||
| messages.quickSaveSuccess | `string` | | 快速保存成功提示 |
|
||||
| primaryField | `string` | `"id"` | 设置 ID 字段名。 |
|
||||
| defaultParams | `Object` | | 设置默认 filter 默认参数,会在查询的时候一起发给后端 |
|
||||
| pageField | `string` | `"page"` | 设置分页页码字段名。 |
|
||||
| perPageField | `string` | `"perPage"` | 设置分页一页显示的多少条数据的字段名。注意:最好与 defaultParams 一起使用,请看下面例子。 |
|
||||
| orderField | `string` | | 设置用来确定位置的字段名,设置后新的顺序将被赋值到该字段中。 |
|
||||
| headerToolbar | Array | `['bulkActions', 'pagination']` | 顶部工具栏配置 |
|
||||
| footerToolbar | Array | `['statistics', 'pagination']` | 顶部工具栏配置 |
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| ------------------------- | ------------------------------ | ------------------------------- | ----------------------------------------------------------------------------------------- |
|
||||
| type | `string` | | `"Action.md"` 指定为 CRUD 渲染器 |
|
||||
| mode | `string` | `"table"` | `"table" 、 "cards" 或者 "list"` |
|
||||
| title | `string` | `""` | 可设置成空,当设置成空时,没有标题栏 |
|
||||
| className | `string` | | 表格外层 Dom 的类名 |
|
||||
| api | [Api](./Types.md#Api) | | CRUD 用来获取列表数据的 api。 |
|
||||
| filter | [Form](./Form.md) | | 设置过滤器,当该表单提交后,会把数据带给当前 Action.md 刷新列表。 |
|
||||
| initFetch | `boolean` | `true` | 是否初始化的时候拉取数据, 只针对有 filter 的情况, 没有 filter 初始都会拉取数据 |
|
||||
| interval | `number` | `3000` | 刷新时间(最低 3000) |
|
||||
| silentPolling | `boolean` | `false` | 配置刷新时是否显示加载动画 |
|
||||
| stopAutoRefreshWhen | `string` | `""` | 通过[表达式](./Types.md#表达式)来配置停止刷新的条件 |
|
||||
| syncLocation | `boolean` | `true` | 是否将过滤条件的参数同步到地址栏 |
|
||||
| draggable | `boolean` | `false` | 是否可通过拖拽排序 |
|
||||
| itemDraggableOn | `boolean` | | 用[表达式](./Types.md#表达式)来配置是否可拖拽排序 |
|
||||
| saveOrderApi | [Api](./Types.md#Api) | | 保存排序的 api。 |
|
||||
| quickSaveApi | [Api](./Types.md#Api) | | 快速编辑后用来批量保存的 API。 |
|
||||
| quickSaveItemApi | [Api](./Types.md#Api) | | 快速编辑配置成及时保存时使用的 API。 |
|
||||
| bulkActions | Array Of [Action](./Action.md) | | 批量操作列表,配置后,表格可进行选中操作。 |
|
||||
| defaultChecked | `boolean` | `false` | 当可批量操作时,默认是否全部勾选。 |
|
||||
| messages | `Object` | | 覆盖消息提示,如果不指定,将采用 api 返回的 message |
|
||||
| messages.fetchFailed | `string` | | 获取失败时提示 |
|
||||
| messages.saveOrderFailed | `string` | | 保存顺序失败提示 |
|
||||
| messages.saveOrderSuccess | `string` | | 保存顺序成功提示 |
|
||||
| messages.quickSaveFailed | `string` | | 快速保存失败提示 |
|
||||
| messages.quickSaveSuccess | `string` | | 快速保存成功提示 |
|
||||
| primaryField | `string` | `"id"` | 设置 ID 字段名。 |
|
||||
| defaultParams | `Object` | | 设置默认 filter 默认参数,会在查询的时候一起发给后端 |
|
||||
| pageField | `string` | `"page"` | 设置分页页码字段名。 |
|
||||
| perPageField | `string` | `"perPage"` | 设置分页一页显示的多少条数据的字段名。注意:最好与 defaultParams 一起使用,请看下面例子。 |
|
||||
| orderField | `string` | | 设置用来确定位置的字段名,设置后新的顺序将被赋值到该字段中。 |
|
||||
| headerToolbar | Array | `['bulkActions', 'pagination']` | 顶部工具栏配置 |
|
||||
| footerToolbar | Array | `['statistics', 'pagination']` | 顶部工具栏配置 |
|
||||
|
|
|
@ -2,21 +2,21 @@
|
|||
|
||||
卡片的展示形式。
|
||||
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| ---------------------- | ---------------------------- | ----------------------------------- | -------------------------------------- |
|
||||
| type | `string` | `"card"` | 指定为 Card 渲染器 |
|
||||
| className | `string` | `"panel-default"` | 外层 Dom 的类名 |
|
||||
| header | `Object` | | Card 头部内容设置 |
|
||||
| header.className | `string` | | 头部类名 |
|
||||
| header.title | `string` | | 标题 |
|
||||
| header.subTitle | `string` | | 副标题 |
|
||||
| header.desc | `string` | | 描述 |
|
||||
| header.avatar | `string` | | 图片 |
|
||||
| header.highlight | `boolean` | | 是否点亮 |
|
||||
| header.avatarClassName | `string` | `"pull-left thumb avatar b-3x m-r"` | 图片类名 |
|
||||
| body | `Array` 或者 [Field](#field) | | 内容容器,主要用来放置 [Field](#field) |
|
||||
| bodyClassName | `string` | `"padder m-t-sm m-b-sm"` | 内容区域类名 |
|
||||
| actions | Array Of [Button](#button) | | 按钮区域 |
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| ---------------------- | -------------------------------- | ----------------------------------- | ------------------------------------------ |
|
||||
| type | `string` | `"card"` | 指定为 Card 渲染器 |
|
||||
| className | `string` | `"panel-default"` | 外层 Dom 的类名 |
|
||||
| header | `Object` | | Card 头部内容设置 |
|
||||
| header.className | `string` | | 头部类名 |
|
||||
| header.title | `string` | | 标题 |
|
||||
| header.subTitle | `string` | | 副标题 |
|
||||
| header.desc | `string` | | 描述 |
|
||||
| header.avatar | `string` | | 图片 |
|
||||
| header.highlight | `boolean` | | 是否点亮 |
|
||||
| header.avatarClassName | `string` | `"pull-left thumb avatar b-3x m-r"` | 图片类名 |
|
||||
| body | `Array` 或者 [Field](./Field.md) | | 内容容器,主要用来放置 [Field](./Field.md) |
|
||||
| bodyClassName | `string` | `"padder m-t-sm m-b-sm"` | 内容区域类名 |
|
||||
| actions | Array Of [Button](./Button.md) | | 按钮区域 |
|
||||
|
||||
```schema:height="300" scope="body"
|
||||
{
|
||||
|
|
|
@ -2,17 +2,17 @@
|
|||
|
||||
卡片集合。
|
||||
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| --------------- | ------------- | ------------------- | -------------------------- |
|
||||
| type | `string` | | `"cards"` 指定为卡片集合。 |
|
||||
| title | `string` | | 标题 |
|
||||
| source | `string` | `${items}` | 数据源, 绑定当前环境变量 |
|
||||
| placeholder | string | ‘暂无数据’ | 当没数据的时候的文字提示 |
|
||||
| className | `string` | | 外层 CSS 类名 |
|
||||
| headerClassName | `string` | `amis-grid-header` | 顶部外层 CSS 类名 |
|
||||
| footerClassName | `string` | `amis-grid-footer` | 底部外层 CSS 类名 |
|
||||
| itemClassName | `string` | `col-sm-4 col-md-3` | 卡片 CSS 类名 |
|
||||
| card | [Card](#card) | | 配置卡片信息 |
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| --------------- | ----------------- | ------------------- | -------------------------- |
|
||||
| type | `string` | | `"cards"` 指定为卡片集合。 |
|
||||
| title | `string` | | 标题 |
|
||||
| source | `string` | `${items}` | 数据源, 绑定当前环境变量 |
|
||||
| placeholder | string | ‘暂无数据’ | 当没数据的时候的文字提示 |
|
||||
| className | `string` | | 外层 CSS 类名 |
|
||||
| headerClassName | `string` | `amis-grid-header` | 顶部外层 CSS 类名 |
|
||||
| footerClassName | `string` | `amis-grid-footer` | 底部外层 CSS 类名 |
|
||||
| itemClassName | `string` | `col-sm-4 col-md-3` | 卡片 CSS 类名 |
|
||||
| card | [Card](./Card.md) | | 配置卡片信息 |
|
||||
|
||||
```schema:height="450" scope="body"
|
||||
{
|
||||
|
|
|
@ -6,9 +6,9 @@
|
|||
- `options` 选项配置,类型为数组,成员格式如下。
|
||||
- `label` 文字
|
||||
- `value` 值
|
||||
- `source` Api 地址,如果选项不固定,可以通过配置 `source` 动态拉取。[详情](/docs/api#select) 另外也可以用 `$xxxx` 来获取当前作用域中的变量。
|
||||
更多配置请参考 [FormItem](#FormItem)。
|
||||
- 更多配置请参考 [FormItem](#FormItem)
|
||||
- `source` Api 地址,如果选项不固定,可以通过配置 `source` 动态拉取。另外也可以用 `$xxxx` 来获取当前作用域中的变量。
|
||||
更多配置请参考 [FormItem](./FormItem.md)。
|
||||
- 更多配置请参考 [FormItem](./FormItem.md)
|
||||
|
||||
```schema:height="300" scope="form-item"
|
||||
{
|
||||
|
|
|
@ -2,16 +2,16 @@
|
|||
|
||||
图表渲染器,采用 echarts 渲染,配置格式跟 echarts 相同,配置文档[文档](http://echarts.baidu.com/option.html#title)
|
||||
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| --------- | ----------------------- | --------- | ------------------------------------------------------------------ |
|
||||
| type | `string` | `"chart"` | 指定为 chart 渲染器 |
|
||||
| className | `string` | | 外层 Dom 的类名 |
|
||||
| body | [Container](#container) | | 内容容器 |
|
||||
| api | [api](#api) | | 配置项远程地址 |
|
||||
| initFetch | `boolean` | | 是否默认拉取 |
|
||||
| interval | `number` | | 刷新时间(最低 3000) |
|
||||
| config | `object/string` | | 设置 eschars 的配置项,当为`string`的时候可以设置 function 等配置项 |
|
||||
| style | `object` | | 设置根元素的 style |
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| --------- | --------------------------------- | --------- | ------------------------------------------------------------------ |
|
||||
| type | `string` | `"chart"` | 指定为 chart 渲染器 |
|
||||
| className | `string` | | 外层 Dom 的类名 |
|
||||
| body | [Container](./Types.md#container) | | 内容容器 |
|
||||
| api | [api](./Types.md#Api) | | 配置项远程地址 |
|
||||
| initFetch | `boolean` | | 是否默认拉取 |
|
||||
| interval | `number` | | 刷新时间(最低 3000) |
|
||||
| config | `object/string` | | 设置 eschars 的配置项,当为`string`的时候可以设置 function 等配置项 |
|
||||
| style | `object` | | 设置根元素的 style |
|
||||
|
||||
```schema:height="350" scope="body"
|
||||
{
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
- `option` 选项说明
|
||||
- `trueValue` 默认 `true`
|
||||
- `falseValue` 默认 `false`
|
||||
- 更多配置请参考 [FormItem](#FormItem)
|
||||
- 更多配置请参考 [FormItem](./FormItem.md)
|
||||
|
||||
```schema:height="200" scope="form-item"
|
||||
{
|
||||
|
|
|
@ -6,12 +6,12 @@
|
|||
- `options` 选项配置,类型为数组,成员格式如下。
|
||||
- `label` 文字
|
||||
- `value` 值
|
||||
- `source` Api 地址,如果选项不固定,可以通过配置 `source` 动态拉取。[详情](/docs/api#select)
|
||||
- `source` Api 地址,如果选项不固定,可以通过配置 `source` 动态拉取。
|
||||
- `joinValues` 默认为 `true` 选中的多个选项的 `value` 会通过 `delimiter` 连接起来,否则直接将以数组的形式提交值。
|
||||
- `extractValue` 默认为 `false`, `joinValues`设置为`false`时生效, 开启后将选中的选项 value 的值封装为数组,作为当前表单项的值。
|
||||
- `delimiter` 默认为 `,`
|
||||
- `columnsCount` 默认为 `1` 可以配置成一行显示多个。
|
||||
- 更多配置请参考 [FormItem](#FormItem)
|
||||
- 更多配置请参考 [FormItem](./FormItem.md)
|
||||
|
||||
```schema:height="330" scope="form"
|
||||
[
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
|
||||
表格中的列配置
|
||||
|
||||
- `type` 默认为 `text`,支持: `text`、`html`、`tpl`、`image`、`progress`、`status`、`date`、`datetime`、`time`、`json`、`mapping`参考 [Field 说明](#field)和[Operation](#operation)。
|
||||
- `type` 默认为 `text`,支持: `text`、`html`、`tpl`、`image`、`progress`、`status`、`date`、`datetime`、`time`、`json`、`mapping`参考 [Field 说明](./Field.md)和[Operation](./Operation.md)。
|
||||
- `name` 用来关联列表数据中的变量 `key`。
|
||||
- `label` 列标题。
|
||||
- `copyable` 开启后,会支持内容点击复制。
|
||||
|
|
|
@ -4,7 +4,7 @@
|
|||
|
||||
- `type` 请设置成 `combo`
|
||||
- `multiple` 默认为 `false` 配置是否为多选模式
|
||||
- `controls` 配置组合成员,所有成员都是横向展示,可以是任意 [FormItem](#FormItem)
|
||||
- `controls` 配置组合成员,所有成员都是横向展示,可以是任意 [FormItem](./FormItem.md)
|
||||
- `controls[x].columnClassName` 列的类名,可以用它配置列宽度。默认平均分配。
|
||||
- `controls[x].unique` 设置当前列值是否唯一,即不允许重复选择。
|
||||
- `maxLength` 当 multiple 为 true 的时候启用,设置可以最大项数。
|
||||
|
@ -22,7 +22,7 @@
|
|||
- `minLength` 限制最小长度。
|
||||
- `maxLength` 限制最大长度。
|
||||
- `scaffold` 单条初始值。默认为 `{}`。
|
||||
- 更多配置请参考 [FormItem](#FormItem)
|
||||
- 更多配置请参考 [FormItem](./FormItem.md)
|
||||
|
||||
```schema:height="450" scope="form"
|
||||
[
|
||||
|
|
|
@ -7,7 +7,7 @@
|
|||
- `inputFormat` 默认 `HH:mm` 用来配置显示的时间格式。
|
||||
- `minDate` 限制最小日期,可用 `${xxx}` 取值,或者输入相对时间,或者时间戳。如:`${start}`、`+3days`、`+3days+2hours`或者 `${start|default:-2days}+3days`
|
||||
- `maxDate` 限制最小日期,可用 `${xxx}` 取值,或者输入相对时间,或者时间戳。如:`${start}`、`+3days`、`+3days+2hours`或者 `${start|default:-2days}+3days`
|
||||
- 更多配置请参考 [FormItem](#FormItem)
|
||||
- 更多配置请参考 [FormItem](./FormItem.md)
|
||||
|
||||
```schema:height="250" scope="form"
|
||||
[
|
||||
|
|
|
@ -15,7 +15,7 @@
|
|||
|
||||
可用单位: `min`、`hour`、`day`、`week`、`month`、`year`。所有单位支持复数形式。
|
||||
|
||||
- 更多配置请参考 [FormItem](#FormItem)
|
||||
- 更多配置请参考 [FormItem](./FormItem.md)
|
||||
|
||||
```schema:height="250" scope="form"
|
||||
[
|
||||
|
|
|
@ -18,7 +18,7 @@
|
|||
|
||||
可用单位: `min`、`hour`、`day`、`week`、`month`、`year`。所有单位支持复数形式。
|
||||
|
||||
- 更多配置请参考 [FormItem](#FormItem)
|
||||
- 更多配置请参考 [FormItem](./FormItem.md)
|
||||
|
||||
```schema:height="250" scope="form"
|
||||
[
|
||||
|
|
|
@ -1,17 +1,17 @@
|
|||
### Dialog
|
||||
|
||||
Dialog 由 [Action](#action) 触发。他是一个类似于 [Page](#page) 的容器模型。
|
||||
Dialog 由 [Action](./Action.md) 触发。他是一个类似于 [Page](./Page.md) 的容器模型。
|
||||
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| ------------- | ------------------------------------- | ------------ | ------------------------------------------------ |
|
||||
| type | `string` | | `"dialog"` 指定为 Dialog 渲染器 |
|
||||
| title | `string` 或者 [Container](#Container) | | 弹出层标题 |
|
||||
| body | [Container](#Container) | | 往 Dialog 内容区加内容 |
|
||||
| size | `string` | | 指定 dialog 大小,支持: `xs`、`sm`、`md`、`lg` |
|
||||
| bodyClassName | `string` | `modal-body` | Dialog body 区域的样式类名 |
|
||||
| closeOnEsc | `boolean` | `false` | 是否支持按 `Esc` 关闭 Dialog |
|
||||
| disabled | `boolean` | `false` | 如果设置此属性,则该 Dialog 只读没有提交操作。 |
|
||||
| actions | Array Of [Action](#action) | | 可以不设置,默认只有【确认】和【取消】两个按钮。 |
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| ------------- | ----------------------------------------------- | ------------ | ------------------------------------------------ |
|
||||
| type | `string` | | `"dialog"` 指定为 Dialog 渲染器 |
|
||||
| title | `string` 或者 [Container](./Types.md#Container) | | 弹出层标题 |
|
||||
| body | [Container](./Types.md#Container) | | 往 Dialog 内容区加内容 |
|
||||
| size | `string` | | 指定 dialog 大小,支持: `xs`、`sm`、`md`、`lg` |
|
||||
| bodyClassName | `string` | `modal-body` | Dialog body 区域的样式类名 |
|
||||
| closeOnEsc | `boolean` | `false` | 是否支持按 `Esc` 关闭 Dialog |
|
||||
| disabled | `boolean` | `false` | 如果设置此属性,则该 Dialog 只读没有提交操作。 |
|
||||
| actions | Array Of [Action](./Action.md) | | 可以不设置,默认只有【确认】和【取消】两个按钮。 |
|
||||
|
||||
```schema:height="200"
|
||||
{
|
||||
|
|
|
@ -1,18 +1,18 @@
|
|||
### Drawer
|
||||
|
||||
Drawer 由 [Action](#action) 触发。
|
||||
Drawer 由 [Action](./Action.md) 触发。
|
||||
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| ------------- | ------------------------------------- | ------------ | ------------------------------------------------ |
|
||||
| type | `string` | | `"drawer"` 指定为 Drawer 渲染器 |
|
||||
| title | `string` 或者 [Container](#Container) | | 弹出层标题 |
|
||||
| body | [Container](#Container) | | 往 Dialog 内容区加内容 |
|
||||
| size | `string` | | 指定 dialog 大小,支持: `xs`、`sm`、`md`、`lg` |
|
||||
| bodyClassName | `string` | `modal-body` | Dialog body 区域的样式类名 |
|
||||
| closeOnEsc | `boolean` | `false` | 是否支持按 `Esc` 关闭 Dialog |
|
||||
| overlay | `boolean` | `true` | 是否显示蒙层 |
|
||||
| resizable | `boolean` | `false` | 是否可通过拖拽改变 Drawer 大小 |
|
||||
| actions | Array Of [Action](#action) | | 可以不设置,默认只有【确认】和【取消】两个按钮。 |
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| ------------- | ----------------------------------------------- | ------------ | ------------------------------------------------ |
|
||||
| type | `string` | | `"drawer"` 指定为 Drawer 渲染器 |
|
||||
| title | `string` 或者 [Container](./Types.md#Container) | | 弹出层标题 |
|
||||
| body | [Container](./Types.md#Container) | | 往 Dialog 内容区加内容 |
|
||||
| size | `string` | | 指定 dialog 大小,支持: `xs`、`sm`、`md`、`lg` |
|
||||
| bodyClassName | `string` | `modal-body` | Dialog body 区域的样式类名 |
|
||||
| closeOnEsc | `boolean` | `false` | 是否支持按 `Esc` 关闭 Dialog |
|
||||
| overlay | `boolean` | `true` | 是否显示蒙层 |
|
||||
| resizable | `boolean` | `false` | 是否可通过拖拽改变 Drawer 大小 |
|
||||
| actions | Array Of [Action](./Action.md) | | 可以不设置,默认只有【确认】和【取消】两个按钮。 |
|
||||
|
||||
```schema:height="200"
|
||||
{
|
||||
|
|
|
@ -4,7 +4,7 @@
|
|||
|
||||
- `type` 请设置成 `editor` 或者 `bat-editor`、`c-editor`、`coffeescript-editor`、`cpp-editor`、`csharp-editor`、`css-editor`、`dockerfile-editor`、`fsharp-editor`、`go-editor`、`handlebars-editor`、`html-editor`、`ini-editor`、`java-editor`、`javascript-editor`、`json-editor`、`less-editor`、`lua-editor`、`markdown-editor`、`msdax-editor`、`objective-c-editor`、`php-editor`、`plaintext-editor`、`postiats-editor`、`powershell-editor`、`pug-editor`、`python-editor`、`r-editor`、`razor-editor`、`ruby-editor`、`sb-editor`、`scss-editor`、`sol-editor`、`sql-editor`、`swift-editor`、`typescript-editor`、`vb-editor`、`xml-editor`、`yaml-editor`。
|
||||
- `language` 默认为 `javascript` 当 `type` 为 `editor` 的时候有用。
|
||||
- 更多配置请参考 [FormItem](#FormItem)
|
||||
- 更多配置请参考 [FormItem](./FormItem.md)
|
||||
|
||||
```schema:height="350" scope="form-item"
|
||||
{
|
||||
|
@ -20,7 +20,7 @@
|
|||
- `language` 默认为 `javascript` 当 `type` 为 `diff-editor` 的时候有用
|
||||
- `diffValue` 设置左侧编辑器的值,支持`${xxx}`获取变量
|
||||
- `disabled` 配置 **右侧编辑器** 是否可编辑,**左侧编辑器**始终不可编辑
|
||||
- 更多配置请参考 [FormItem](#FormItem)
|
||||
- 更多配置请参考 [FormItem](./FormItem.md)
|
||||
|
||||
PS: 当用作纯展示时,可以通过`value`配置项,设置右侧编辑器的值
|
||||
|
||||
|
|
|
@ -1,11 +1,11 @@
|
|||
## Field
|
||||
|
||||
主要用在 [Table](#table) 的列配置 Column、[List](#list) 的内容、[Card](#card) 卡片的内容和表单的[Static-XXX](#static-xxx) 中。它主要用来展示数据。
|
||||
主要用在 [Table](./Table.md) 的列配置 Column、[List](./List.md) 的内容、[Card](./Card.md) 卡片的内容和表单的[Static-XXX](./Static.md#static-xxx) 中。它主要用来展示数据。
|
||||
|
||||
```schema:height="450" scope="body"
|
||||
{
|
||||
"type": "crud",
|
||||
"api": "/api/mock2/crud/list",
|
||||
"type": "Action.md",
|
||||
"api": "/api/mock2/Action.md/list",
|
||||
"affixHeader": false,
|
||||
"syncLocation": false,
|
||||
"columns": [
|
||||
|
@ -80,10 +80,10 @@
|
|||
- `placeholder` 当没有值时的展示内容。
|
||||
- `popOver` 配置后在内容区增加一个放大按钮,点击后弹出一个详情弹框。
|
||||
`boolean` 简单的开启或者关闭
|
||||
`Object` 弹出的内容配置。请参考 [Dialog](#dialog) 配置说明。
|
||||
`Object` 弹出的内容配置。请参考 [Dialog](./Dialog.md) 配置说明。
|
||||
- `quickEdit` 配置后在内容区增加一个编辑按钮,点击后弹出一个编辑框。
|
||||
`boolean` 简单的开启或者关闭
|
||||
`Object` 快速编辑详情,请参考 [FormItem](#formitem) 配置。
|
||||
`Object` 快速编辑详情,请参考 [FormItem](./FormItem.md) 配置。
|
||||
`.mode` 模式如果设置为 `inline` 模式,则直接展示输入框,而不需要点击按钮后展示。
|
||||
`.saveImmediately` 开启后,直接保存,而不是等全部操作完后批量保存。
|
||||
- `copyable` 配置后会在内容区增加一个复制按钮,点击后把内容复制到剪切板。
|
||||
|
@ -91,11 +91,11 @@
|
|||
|
||||
### Tpl(Field)
|
||||
|
||||
请参考[tpl](#tpl)
|
||||
请参考[tpl](./Tpl.md)
|
||||
|
||||
### Plain(Field)
|
||||
|
||||
请参考[Plain](#plain)
|
||||
请参考[Plain](./Plain.md)
|
||||
|
||||
### Json(Field)
|
||||
|
||||
|
@ -185,18 +185,18 @@ todo
|
|||
|
||||
## Tabs
|
||||
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| ----------------- | ----------------------- | ----------------------------------- | -------------------------------------------------------- |
|
||||
| type | `string` | `"tabs"` | 指定为 Tabs 渲染器 |
|
||||
| className | `string` | | 外层 Dom 的类名 |
|
||||
| tabsClassName | `string` | | Tabs Dom 的类名 |
|
||||
| tabs | `Array` | | tabs 内容 |
|
||||
| tabs[x].title | `string` | | Tab 标题 |
|
||||
| tabs[x].icon | `icon` | | Tab 的图标 |
|
||||
| tabs[x].tab | [Container](#container) | | 内容区 |
|
||||
| tabs[x].hash | `string` | | 设置以后将跟 url 的 hash 对应 |
|
||||
| tabs[x].reload | `boolean` | | 设置以后内容每次都会重新渲染,对于 crud 的重新拉取很有用 |
|
||||
| tabs[x].className | `string` | `"bg-white b-l b-r b-b wrapper-md"` | Tab 区域样式 |
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| ----------------- | --------------------------------- | ----------------------------------- | ------------------------------------------------------------- |
|
||||
| type | `string` | `"tabs"` | 指定为 Tabs 渲染器 |
|
||||
| className | `string` | | 外层 Dom 的类名 |
|
||||
| tabsClassName | `string` | | Tabs Dom 的类名 |
|
||||
| tabs | `Array` | | tabs 内容 |
|
||||
| tabs[x].title | `string` | | Tab 标题 |
|
||||
| tabs[x].icon | `icon` | | Tab 的图标 |
|
||||
| tabs[x].tab | [Container](./Types.md#Container) | | 内容区 |
|
||||
| tabs[x].hash | `string` | | 设置以后将跟 url 的 hash 对应 |
|
||||
| tabs[x].reload | `boolean` | | 设置以后内容每次都会重新渲染,对于 Action.md 的重新拉取很有用 |
|
||||
| tabs[x].className | `string` | `"bg-white b-l b-r b-b wrapper-md"` | Tab 区域样式 |
|
||||
|
||||
```schema:height="300" scope="body"
|
||||
{
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
- `type` 请设置成 `fieldSet`
|
||||
- `title` 标题
|
||||
- `controls` 表单项集合。
|
||||
- `mode` 展示默认,跟 [Form](#form) 中的模式一样,选择: `normal`、`horizontal`或者`inline`。
|
||||
- `mode` 展示默认,跟 [Form](./Form.md) 中的模式一样,选择: `normal`、`horizontal`或者`inline`。
|
||||
- `horizontal` 当为水平模式时,用来控制左右占比。
|
||||
- `horizontal.label` 左边 label 的宽度占比。
|
||||
- `horizontal.right` 右边控制器的宽度占比。
|
||||
|
|
|
@ -19,7 +19,7 @@
|
|||
- `startChunkApi` 默认 `/api/upload/startChunk` 想自己存储时才需要关注。
|
||||
- `chunkApi` 默认 `/api/upload/chunk` 想自己存储时才需要关注。
|
||||
- `finishChunkApi` 默认 `/api/upload/finishChunk` 想自己存储时才需要关注。
|
||||
- 更多配置请参考 [FormItem](#FormItem)
|
||||
- 更多配置请参考 [FormItem](./FormItem.md)
|
||||
|
||||
```schema:height="250" scope="form-item"
|
||||
{
|
||||
|
|
|
@ -42,18 +42,18 @@
|
|||
| messages.saveFailed | `string` | | 保存成功时提示 |
|
||||
| messages.saveSuccess | `string` | | 保存失败时提示 |
|
||||
| wrapWithPanel | `boolean` | `true` | 是否让 Form 用 panel 包起来,设置为 false 后,actions 将无效。 |
|
||||
| api | [Api](./类型说明.md#api) | | Form 用来保存数据的 api。 |
|
||||
| initApi | [Api](./类型说明.md#api) | | Form 用来获取初始数据的 api。 |
|
||||
| api | [Api](./Types.md#api) | | Form 用来保存数据的 api。 |
|
||||
| initApi | [Api](./Types.md#api) | | Form 用来获取初始数据的 api。 |
|
||||
| interval | `number` | `3000` | 刷新时间(最低 3000) |
|
||||
| silentPolling | `boolean` | `false` | 配置刷新时是否显示加载动画 |
|
||||
| stopAutoRefreshWhen | `string` | `""` | 通过[表达式](./类型说明.md#表达式) 来配置停止刷新的条件 |
|
||||
| initAsyncApi | [Api](./类型说明.md#api) | | Form 用来获取初始数据的 api,与 initApi 不同的是,会一直轮训请求该接口,直到返回 finished 属性为 true 才 结束。 |
|
||||
| stopAutoRefreshWhen | `string` | `""` | 通过[表达式](./Types.md#表达式) 来配置停止刷新的条件 |
|
||||
| initAsyncApi | [Api](./Types.md#api) | | Form 用来获取初始数据的 api,与 initApi 不同的是,会一直轮训请求该接口,直到返回 finished 属性为 true 才 结束。 |
|
||||
| initFetch | `boolean` | `true` | 设置了 initApi 或者 initAsyncApi 后,默认会开始就发请求,设置为 false 后就不会起始就请求接口 |
|
||||
| initFetchOn | `string` | | 用表达式来配置 |
|
||||
| initFinishedField | `string` | `finished` | 设置了 initAsyncApi 后,默认会从返回数据的 data.finished 来判断是否完成,也可以设置成其他的 xxx,就会从 data.xxx 中获取 |
|
||||
| initCheckInterval | `number` | `3000` | 设置了 initAsyncApi 以后,默认拉取的时间间隔 |
|
||||
| schemaApi | [Api](./类型说明.md#api) | | `已不支持`,请改用 controls 里面放置 Service 渲染器实现 |
|
||||
| asyncApi | [Api](./类型说明.md#api) | | 设置此属性后,表单提交发送保存接口后,还会继续轮训请求该接口,直到返回 `finished` 属性为 `true` 才 结束。 |
|
||||
| schemaApi | [Api](./Types.md#api) | | `已不支持`,请改用 controls 里面放置 Service 渲染器实现 |
|
||||
| asyncApi | [Api](./Types.md#api) | | 设置此属性后,表单提交发送保存接口后,还会继续轮训请求该接口,直到返回 `finished` 属性为 `true` 才 结束。 |
|
||||
| checkInterval | `number` | 3000 | 轮训请求的时间间隔,默认为 3 秒。设置 `asyncApi` 才有效 |
|
||||
| finishedField | `string` | `"finished"` | 如果决定结束的字段名不是 `finished` 请设置此属性,比如 `is_success` |
|
||||
| submitOnChange | `boolean` | `false` | 表单修改即提交 |
|
||||
|
|
|
@ -64,14 +64,14 @@ button-group 有两种模式,除了能让按钮组合在一起,还能做类
|
|||
- `label` 文字
|
||||
- `value` 值
|
||||
- `image` 图片的 http 地址。
|
||||
- `source` Api 地址,如果选项不固定,可以通过配置 `source` 动态拉取。[详情](/docs/api#select)
|
||||
- `source` Api 地址,如果选项不固定,可以通过配置 `source` 动态拉取。
|
||||
- `multiple` 默认为 `false`, 设置成 `true` 表示可多选。
|
||||
- `joinValues` 默认为 `true`
|
||||
- 单选模式:当用户选中某个选项时,选项中的 value 将被作为该表单项的值提交,否则,整个选项对象都会作为该表单项的值提交。
|
||||
- 多选模式:选中的多个选项的 `value` 会通过 `delimiter` 连接起来,否则直接将以数组的形式提交值。
|
||||
- `delimiter` 默认为 `,`
|
||||
- `clearable` 默认为 `true`, 表示可以取消选中。
|
||||
- 更多配置请参考 [FormItem](#FormItem)
|
||||
- 更多配置请参考 [FormItem](./FormItem.md)
|
||||
|
||||
```schema:height="250" scope="form"
|
||||
[
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
### HBox(FormItem)
|
||||
|
||||
支持 form 内部再用 HBox 布局,实现左右排列。没错用 [Group](#group) 也能实现,所以还是推荐用 [Group](#group)。
|
||||
支持 form 内部再用 HBox 布局,实现左右排列。没错用 [Group](./Group.md) 也能实现,所以还是推荐用 [Group](./Group.md)。
|
||||
|
||||
- `type` 请设置成 `hbox`
|
||||
- `columns` 数据,用来配置列内容。每个 column 又一个独立的渲染器。
|
||||
|
|
|
@ -7,14 +7,14 @@
|
|||
- `label` 文字
|
||||
- `value` 值
|
||||
- `image` 图片的 http 地址。
|
||||
- `source` Api 地址,如果选项不固定,可以通过配置 `source` 动态拉取。[详情](/docs/api#select)
|
||||
- `source` Api 地址,如果选项不固定,可以通过配置 `source` 动态拉取。
|
||||
- `multiple` 默认为 `false`, 设置成 `true` 表示可多选。
|
||||
- `joinValues` 默认为 `true`
|
||||
- 单选模式:当用户选中某个选项时,选项中的 value 将被作为该表单项的值提交,否则,整个选项对象都会作为该表单项的值提交。
|
||||
- 多选模式:选中的多个选项的 `value` 会通过 `delimiter` 连接起来,否则直接将以数组的形式提交值。
|
||||
- `delimiter` 默认为 `,`
|
||||
- `clearable` 默认为 `true`, 表示可以取消选中。
|
||||
- 更多配置请参考 [FormItem](#FormItem)
|
||||
- 更多配置请参考 [FormItem](./FormItem.md)
|
||||
|
||||
单选
|
||||
|
||||
|
|
|
@ -1,11 +1,11 @@
|
|||
### Panel(FormItem)
|
||||
|
||||
还是为了布局,可以把一部分 [FormItem](#formItem) 合并到一个 panel 里面单独展示。
|
||||
还是为了布局,可以把一部分 [FormItem](./FormItem.md) 合并到一个 panel 里面单独展示。
|
||||
|
||||
- `title` panel 标题
|
||||
- `body` [Container](#container) 可以是其他渲染模型。
|
||||
- `body` [Container](./Types.md#container) 可以是其他渲染模型。
|
||||
- `bodyClassName` body 的 className.
|
||||
- `footer` [Container](#container) 可以是其他渲染模型。
|
||||
- `footer` [Container](./Types.md#container) 可以是其他渲染模型。
|
||||
- `footerClassName` footer 的 className.
|
||||
- `controls` 跟 `body` 二选一,如果设置了 controls 优先显示表单集合。
|
||||
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
### Table(FormItem)
|
||||
|
||||
可以用来展现数据的,可以用来展示数组类型的数据,比如 multiple 的[子 form](#SubForm)。
|
||||
可以用来展现数据的,可以用来展示数组类型的数据,比如 multiple 的[子 form](./SubForm.md)。
|
||||
|
||||
- `type` 请设置成 `table`
|
||||
- `columns` 数组类型,用来定义列信息。
|
||||
|
@ -54,9 +54,9 @@
|
|||
| addable | `boolean` | false | 是否可增加一行 |
|
||||
| editable | `boolean` | false | 是否可编辑 |
|
||||
| removable | `boolean` | false | 是否可删除 |
|
||||
| addApi | [api](#api) | - | 新增时提交的 API |
|
||||
| updateApi | [api](#api) | - | 修改时提交的 API |
|
||||
| deleteApi | [api](#api) | - | 删除时提交的 API |
|
||||
| addApi | [api](./Types.md#Api) | - | 新增时提交的 API |
|
||||
| updateApi | [api](./Types.md#Api) | - | 修改时提交的 API |
|
||||
| deleteApi | [api](./Types.md#Api) | - | 删除时提交的 API |
|
||||
| addBtnLabel | `string` | | 增加按钮名称 |
|
||||
| addBtnIcon | `string` | `"fa fa-plus"` | 增加按钮图标 |
|
||||
| updateBtnLabel | `string` | `""` | 更新按钮名称 |
|
||||
|
@ -71,7 +71,7 @@
|
|||
| columns[x].quickEdit | `boolean` 或者 `object` | - | 配合 editable 为 true 一起使用 |
|
||||
| columns[x].quickEditOnUpdate | `boolean` 或者 `object` | - | 可以用来区分新建模式和更新模式的编辑配置 |
|
||||
|
||||
- 更多配置请参考 [FormItem](#FormItem)
|
||||
- 更多配置请参考 [FormItem](./FormItem.md)
|
||||
- 更多 Demo 详情请参考 [表格编辑](/docs/examples/form/table)
|
||||
|
||||
```schema:height="250" scope="form-item"
|
||||
|
|
|
@ -12,15 +12,15 @@ Form 中主要是由各种 FormItem 组成。FormItem 中主要包含这些字
|
|||
- `submitOnChange` 是否该表单项值发生变化时就提交当前表单。
|
||||
- `className` 表单最外层类名。
|
||||
- `disabled` 当前表单项是否是禁用状态。
|
||||
- `disabledOn` 通过[表达式](./类型说明.md#表达式)来配置当前表单项的禁用状态。
|
||||
- `disabledOn` 通过[表达式](./Types.md#表达式)来配置当前表单项的禁用状态。
|
||||
- `visible` 是否可见。
|
||||
- `visibleOn` 通过[表达式](./类型说明.md#表达式)来配置当前表单项是否显示。
|
||||
- `visibleOn` 通过[表达式](./Types.md#表达式)来配置当前表单项是否显示。
|
||||
- `hidden` 是否隐藏,不要跟 `visible` `visibleOn` 同时配置
|
||||
- `hiddenOn` 通过[表达式](./类型说明.md#表达式)来配置当前表单项是否隐藏。
|
||||
- `hiddenOn` 通过[表达式](./Types.md#表达式)来配置当前表单项是否隐藏。
|
||||
- `inputClassName` 表单控制器类名。
|
||||
- `labelClassName` label 的类名。
|
||||
- `required` 是否为必填。
|
||||
- `requiredOn` 通过[表达式](./类型说明.md#表达式)来配置当前表单项是否为必填。
|
||||
- `requiredOn` 通过[表达式](./Types.md#表达式)来配置当前表单项是否为必填。
|
||||
- `validations` 格式验证,支持设置多个,多个规则用英文逗号隔开。
|
||||
|
||||
- `isEmptyString` 必须是空白字符。
|
||||
|
|
|
@ -1,31 +1,31 @@
|
|||
## Grid
|
||||
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| ------------------- | ----------------------- | -------- | ----------------------- |
|
||||
| type | `string` | `"grid"` | 指定为 Grid 渲染器 |
|
||||
| className | `string` | | 外层 Dom 的类名 |
|
||||
| columns | `Array` | | 列集合 |
|
||||
| columns[x] | [Container](#Container) | | 成员可以是其他渲染器 |
|
||||
| columns[x].xs | `int` | | 宽度占比: 1 - 12 |
|
||||
| columns[x].xsHidden | `boolean` | | 是否隐藏 |
|
||||
| columns[x].xsOffset | `int` | | 偏移量 1 - 12 |
|
||||
| columns[x].xsPull | `int` | | 靠左的距离占比:1 - 12 |
|
||||
| columns[x].xsPush | `int` | | 靠右的距离占比: 1 - 12 |
|
||||
| columns[x].sm | `int` | | 宽度占比: 1 - 12 |
|
||||
| columns[x].smHidden | `boolean` | | 是否隐藏 |
|
||||
| columns[x].smOffset | `int` | | 偏移量 1 - 12 |
|
||||
| columns[x].smPull | `int` | | 靠左的距离占比:1 - 12 |
|
||||
| columns[x].smPush | `int` | | 靠右的距离占比: 1 - 12 |
|
||||
| columns[x].md | `int` | | 宽度占比: 1 - 12 |
|
||||
| columns[x].mdHidden | `boolean` | | 是否隐藏 |
|
||||
| columns[x].mdOffset | `int` | | 偏移量 1 - 12 |
|
||||
| columns[x].mdPull | `int` | | 靠左的距离占比:1 - 12 |
|
||||
| columns[x].mdPush | `int` | | 靠右的距离占比: 1 - 12 |
|
||||
| columns[x].lg | `int` | | 宽度占比: 1 - 12 |
|
||||
| columns[x].lgHidden | `boolean` | | 是否隐藏 |
|
||||
| columns[x].lgOffset | `int` | | 偏移量 1 - 12 |
|
||||
| columns[x].lgPull | `int` | | 靠左的距离占比:1 - 12 |
|
||||
| columns[x].lgPush | `int` | | 靠右的距离占比: 1 - 12 |
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| ------------------- | --------------------------------- | -------- | ----------------------- |
|
||||
| type | `string` | `"grid"` | 指定为 Grid 渲染器 |
|
||||
| className | `string` | | 外层 Dom 的类名 |
|
||||
| columns | `Array` | | 列集合 |
|
||||
| columns[x] | [Container](./Types.md#Container) | | 成员可以是其他渲染器 |
|
||||
| columns[x].xs | `int` | | 宽度占比: 1 - 12 |
|
||||
| columns[x].xsHidden | `boolean` | | 是否隐藏 |
|
||||
| columns[x].xsOffset | `int` | | 偏移量 1 - 12 |
|
||||
| columns[x].xsPull | `int` | | 靠左的距离占比:1 - 12 |
|
||||
| columns[x].xsPush | `int` | | 靠右的距离占比: 1 - 12 |
|
||||
| columns[x].sm | `int` | | 宽度占比: 1 - 12 |
|
||||
| columns[x].smHidden | `boolean` | | 是否隐藏 |
|
||||
| columns[x].smOffset | `int` | | 偏移量 1 - 12 |
|
||||
| columns[x].smPull | `int` | | 靠左的距离占比:1 - 12 |
|
||||
| columns[x].smPush | `int` | | 靠右的距离占比: 1 - 12 |
|
||||
| columns[x].md | `int` | | 宽度占比: 1 - 12 |
|
||||
| columns[x].mdHidden | `boolean` | | 是否隐藏 |
|
||||
| columns[x].mdOffset | `int` | | 偏移量 1 - 12 |
|
||||
| columns[x].mdPull | `int` | | 靠左的距离占比:1 - 12 |
|
||||
| columns[x].mdPush | `int` | | 靠右的距离占比: 1 - 12 |
|
||||
| columns[x].lg | `int` | | 宽度占比: 1 - 12 |
|
||||
| columns[x].lgHidden | `boolean` | | 是否隐藏 |
|
||||
| columns[x].lgOffset | `int` | | 偏移量 1 - 12 |
|
||||
| columns[x].lgPull | `int` | | 靠左的距离占比:1 - 12 |
|
||||
| columns[x].lgPush | `int` | | 靠右的距离占比: 1 - 12 |
|
||||
|
||||
更多使用说明,请参看 [Grid Props](https://react-bootstrap.github.io/components.html#grid-props-col)
|
||||
|
||||
|
|
|
@ -4,7 +4,7 @@
|
|||
|
||||
- `type` 请设置成 `group`
|
||||
- `controls` 表单项集合。
|
||||
- `mode` 展示默认,跟 [Form](#form) 中的模式一样,选择: `normal`、`horizontal`或者`inline`。
|
||||
- `mode` 展示默认,跟 [Form](./Form.md) 中的模式一样,选择: `normal`、`horizontal`或者`inline`。
|
||||
- `horizontal` 当为水平模式时,用来控制左右占比。
|
||||
- `horizontal.label` 左边 label 的宽度占比。
|
||||
- `horizontal.right` 右边控制器的宽度占比。
|
||||
|
|
|
@ -1,12 +1,12 @@
|
|||
## HBox
|
||||
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| -------------------------- | ----------------------- | -------------- | -------------------- |
|
||||
| type | `string` | `"hbox"` | 指定为 HBox 渲染器 |
|
||||
| className | `string` | | 外层 Dom 的类名 |
|
||||
| columns | `Array` | | 列集合 |
|
||||
| columns[x] | [Container](#Container) | | 成员可以是其他渲染器 |
|
||||
| columns[x].columnClassName | `string` | `"wrapper-xs"` | 列上类名 |
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| -------------------------- | --------------------------------- | -------------- | -------------------- |
|
||||
| type | `string` | `"hbox"` | 指定为 HBox 渲染器 |
|
||||
| className | `string` | | 外层 Dom 的类名 |
|
||||
| columns | `Array` | | 列集合 |
|
||||
| columns[x] | [Container](./Types.md#Container) | | 成员可以是其他渲染器 |
|
||||
| columns[x].columnClassName | `string` | `"wrapper-xs"` | 列上类名 |
|
||||
|
||||
```schema:height="300" scope="body"
|
||||
[
|
||||
|
|
|
@ -25,7 +25,7 @@
|
|||
- `minHeight` 限制图片最小高度。
|
||||
- `maxWidth` 限制图片最大宽度。
|
||||
- `maxHeight` 限制图片最大高度。
|
||||
- 更多配置请参考 [FormItem](#FormItem)
|
||||
- 更多配置请参考 [FormItem](./FormItem.md)
|
||||
|
||||
```schema:height="250" scope="form-item"
|
||||
{
|
||||
|
|
|
@ -2,24 +2,24 @@
|
|||
|
||||
列表展示。
|
||||
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| ------------------------ | ---------------------------- | --------------------- | -------------------------------------- |
|
||||
| type | `string` | | `"list"` 指定为列表展示。 |
|
||||
| title | `string` | | 标题 |
|
||||
| source | `string` | `${items}` | 数据源, 绑定当前环境变量 |
|
||||
| placeholder | string | ‘暂无数据’ | 当没数据的时候的文字提示 |
|
||||
| className | `string` | | 外层 CSS 类名 |
|
||||
| headerClassName | `string` | `amis-list-header` | 顶部外层 CSS 类名 |
|
||||
| footerClassName | `string` | `amis-list-footer` | 底部外层 CSS 类名 |
|
||||
| listItem | `Array` | | 配置单条信息 |
|
||||
| listItem.title | `string` | | 标题,支持模板语法如: \${xxx} |
|
||||
| listItem.titleClassName | `string` | `h5` | 标题 CSS 类名 |
|
||||
| listItem.subTitle | `string` | | 副标题,支持模板语法如: \${xxx} |
|
||||
| listItem.avatar | `string` | | 图片地址,支持模板语法如: \${xxx} |
|
||||
| listItem.avatarClassName | `string` | `thumb-sm avatar m-r` | 图片 CSS 类名 |
|
||||
| listItem.desc | `string` | | 描述,支持模板语法如: \${xxx} |
|
||||
| listItem.body | `Array` 或者 [Field](#field) | | 内容容器,主要用来放置 [Field](#field) |
|
||||
| listItem.actions | Array Of [Button](#button) | | 按钮区域 |
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| ------------------------ | -------------------------------- | --------------------- | ------------------------------------------ |
|
||||
| type | `string` | | `"list"` 指定为列表展示。 |
|
||||
| title | `string` | | 标题 |
|
||||
| source | `string` | `${items}` | 数据源, 绑定当前环境变量 |
|
||||
| placeholder | string | ‘暂无数据’ | 当没数据的时候的文字提示 |
|
||||
| className | `string` | | 外层 CSS 类名 |
|
||||
| headerClassName | `string` | `amis-list-header` | 顶部外层 CSS 类名 |
|
||||
| footerClassName | `string` | `amis-list-footer` | 底部外层 CSS 类名 |
|
||||
| listItem | `Array` | | 配置单条信息 |
|
||||
| listItem.title | `string` | | 标题,支持模板语法如: \${xxx} |
|
||||
| listItem.titleClassName | `string` | `h5` | 标题 CSS 类名 |
|
||||
| listItem.subTitle | `string` | | 副标题,支持模板语法如: \${xxx} |
|
||||
| listItem.avatar | `string` | | 图片地址,支持模板语法如: \${xxx} |
|
||||
| listItem.avatarClassName | `string` | `thumb-sm avatar m-r` | 图片 CSS 类名 |
|
||||
| listItem.desc | `string` | | 描述,支持模板语法如: \${xxx} |
|
||||
| listItem.body | `Array` 或者 [Field](./Field.md) | | 内容容器,主要用来放置 [Field](./Field.md) |
|
||||
| listItem.actions | Array Of [Button](./Button.md) | | 按钮区域 |
|
||||
|
||||
```schema:height="400" scope="body"
|
||||
{
|
||||
|
|
|
@ -6,8 +6,8 @@
|
|||
- `columns` 列信息, 数组中 `label` 字段是必须给出的
|
||||
- `rows` 行信息, 数组中 `label` 字段是必须给出的
|
||||
- `rowLabel` 行标题说明
|
||||
- `source` Api 地址,如果选项不固定,可以通过配置 `source` 动态拉取。[详情](/docs/api#matrix)
|
||||
- 更多配置请参考 [FormItem](#FormItem)
|
||||
- `source` Api 地址,如果选项不固定,可以通过配置 `source` 动态拉取。
|
||||
- 更多配置请参考 [FormItem](./FormItem.md)
|
||||
|
||||
```schema:height="250" scope="form-item"
|
||||
{
|
||||
|
|
|
@ -3,15 +3,15 @@
|
|||
树形结构选择框。
|
||||
|
||||
- `type` 请设置成 `nested-select`
|
||||
- `options` 类似于 [select](#select) 中 `options`, 并且支持通过 `children` 无限嵌套。
|
||||
- `source` Api 地址,如果选项不固定,可以通过配置 `source` 动态拉取。[详情](/docs/api#tree)
|
||||
- `options` 类似于 [select](./Select.md) 中 `options`, 并且支持通过 `children` 无限嵌套。
|
||||
- `source` Api 地址,如果选项不固定,可以通过配置 `source` 动态拉取。
|
||||
- `multiple` 默认为 `false`, 设置成 `true` 表示可多选。
|
||||
- `joinValues` 默认为 `true`
|
||||
- 单选模式:当用户选中某个选项时,选项中的 value 将被作为该表单项的值提交,否则,整个选项对象都会作为该表单项的值提交。
|
||||
- 多选模式:选中的多个选项的 `value` 会通过 `delimiter` 连接起来,否则直接将以数组的形式提交值。
|
||||
- `extractValue` 默认为 `false`, `joinValues`设置为`false`时生效, 开启后将选中的选项 value 的值封装为数组,作为当前表单项的值。
|
||||
- `delimiter` 默认为 `,`
|
||||
- 更多配置请参考 [FormItem](#FormItem)
|
||||
- 更多配置请参考 [FormItem](./FormItem.md)
|
||||
|
||||
```schema:height="300" scope="form-item"
|
||||
{
|
||||
|
|
|
@ -4,4 +4,4 @@
|
|||
|
||||
- `type` 请设置成 `operation`。
|
||||
- `label` 列标题。
|
||||
- `buttons` 按钮集合,请参考[Button](#button) 按钮配置说明。
|
||||
- `buttons` 按钮集合,请参考[Button](./Button.md) 按钮配置说明。
|
||||
|
|
|
@ -16,23 +16,23 @@ Json 配置最外层是一个 `Page` 渲染器。他主要包含标题,副标
|
|||
|
||||
> PS: 代码支持及时编辑预览
|
||||
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| ------------------- | ------------------------------------ | ------------------------------------------ | ----------------------------------------------------------------------------------- |
|
||||
| type | `string` | `"page"` | 指定为 Page 渲染器。 |
|
||||
| title | `string` | | 页面标题 |
|
||||
| subTitle | `string` | | 页面副标题 |
|
||||
| remark | `string` | | 标题附近会出现一个提示图标,鼠标放上去会提示该内容。 |
|
||||
| aside | [Container](./类型说明.md#Container) | | 往页面的边栏区域加内容 |
|
||||
| toolbar | [Container](./类型说明.md#Container) | | 往页面的右上角加内容,需要注意的是,当有 Title 是,区域在右上角,没有时区域就在顶部 |
|
||||
| body | [Container](./类型说明.md#Container) | | 往页面的内容区域加内容 |
|
||||
| className | `string` | | 外层 dom 类名 |
|
||||
| toolbarClassName | `string` | `v-middle wrapper text-right bg-light b-b` | Toolbar dom 类名 |
|
||||
| bodyClassName | `string` | `wrapper` | Body dom 类名 |
|
||||
| asideClassName | `string` | `w page-aside-region bg-auto` | Aside dom 类名 |
|
||||
| headerClassName | `string` | `bg-light b-b wrapper` | Header 区域 dom 类名 |
|
||||
| initApi | [Api](./类型说明.md#Api) | | Page 用来获取初始数据的 api。返回的数据可以整个 page 级别使用。 |
|
||||
| initFetch | `boolean` | `true` | 是否起始拉取 initApi |
|
||||
| initFetchOn | `string` | | 是否起始拉取 initApi, 通过表达式配置 |
|
||||
| interval | `number` | `3000` | 刷新时间(最低 3000) |
|
||||
| silentPolling | `boolean` | `false` | 配置刷新时是否显示加载动画 |
|
||||
| stopAutoRefreshWhen | `string` | `""` | 通过[表达式](./类型说明.md#表达式)来配置停止刷新的条件 |
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| ------------------- | --------------------------------- | ------------------------------------------ | ----------------------------------------------------------------------------------- |
|
||||
| type | `string` | `"page"` | 指定为 Page 渲染器。 |
|
||||
| title | `string` | | 页面标题 |
|
||||
| subTitle | `string` | | 页面副标题 |
|
||||
| remark | `string` | | 标题附近会出现一个提示图标,鼠标放上去会提示该内容。 |
|
||||
| aside | [Container](./Types.md#Container) | | 往页面的边栏区域加内容 |
|
||||
| toolbar | [Container](./Types.md#Container) | | 往页面的右上角加内容,需要注意的是,当有 Title 是,区域在右上角,没有时区域就在顶部 |
|
||||
| body | [Container](./Types.md#Container) | | 往页面的内容区域加内容 |
|
||||
| className | `string` | | 外层 dom 类名 |
|
||||
| toolbarClassName | `string` | `v-middle wrapper text-right bg-light b-b` | Toolbar dom 类名 |
|
||||
| bodyClassName | `string` | `wrapper` | Body dom 类名 |
|
||||
| asideClassName | `string` | `w page-aside-region bg-auto` | Aside dom 类名 |
|
||||
| headerClassName | `string` | `bg-light b-b wrapper` | Header 区域 dom 类名 |
|
||||
| initApi | [Api](./Types.md#Api) | | Page 用来获取初始数据的 api。返回的数据可以整个 page 级别使用。 |
|
||||
| initFetch | `boolean` | `true` | 是否起始拉取 initApi |
|
||||
| initFetchOn | `string` | | 是否起始拉取 initApi, 通过表达式配置 |
|
||||
| interval | `number` | `3000` | 刷新时间(最低 3000) |
|
||||
| silentPolling | `boolean` | `false` | 配置刷新时是否显示加载动画 |
|
||||
| stopAutoRefreshWhen | `string` | `""` | 通过[表达式](./Types.md#表达式)来配置停止刷新的条件 |
|
||||
|
|
|
@ -2,19 +2,19 @@
|
|||
|
||||
可以把相关信息以盒子的形式展示到一块。
|
||||
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| ---------------- | -------------------------- | -------------------------------------- | ------------------- |
|
||||
| type | `string` | `"panel"` | 指定为 Panel 渲染器 |
|
||||
| className | `string` | `"panel-default"` | 外层 Dom 的类名 |
|
||||
| headerClassName | `string` | `"panel-heading"` | header 区域的类名 |
|
||||
| footerClassName | `string` | `"panel-footer bg-light lter wrapper"` | footer 区域的类名 |
|
||||
| actionsClassName | `string` | `"panel-footer"` | actions 区域的类名 |
|
||||
| bodyClassName | `string` | `"panel-body"` | body 区域的类名 |
|
||||
| title | `string` | | 标题 |
|
||||
| header | [Container](#container) | | 顶部容器 |
|
||||
| body | [Container](#container) | | 内容容器 |
|
||||
| footer | [Container](#container) | | 底部容器 |
|
||||
| actions | Array Of [Button](#button) | | 按钮区域 |
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| ---------------- | --------------------------------- | -------------------------------------- | ------------------- |
|
||||
| type | `string` | `"panel"` | 指定为 Panel 渲染器 |
|
||||
| className | `string` | `"panel-default"` | 外层 Dom 的类名 |
|
||||
| headerClassName | `string` | `"panel-heading"` | header 区域的类名 |
|
||||
| footerClassName | `string` | `"panel-footer bg-light lter wrapper"` | footer 区域的类名 |
|
||||
| actionsClassName | `string` | `"panel-footer"` | actions 区域的类名 |
|
||||
| bodyClassName | `string` | `"panel-body"` | body 区域的类名 |
|
||||
| title | `string` | | 标题 |
|
||||
| header | [Container](./Types.md#container) | | 顶部容器 |
|
||||
| body | [Container](./Types.md#container) | | 内容容器 |
|
||||
| footer | [Container](./Types.md#container) | | 底部容器 |
|
||||
| actions | Array Of [Button](./Button.md) | | 按钮区域 |
|
||||
|
||||
```schema:height="300" scope="body"
|
||||
{
|
||||
|
|
|
@ -7,15 +7,15 @@
|
|||
- `options` 选项配置,类型为数组,成员格式如下。
|
||||
- `label` 文字
|
||||
- `value` 值
|
||||
- `source` Api 地址,如果选项不固定,可以通过配置 `source` 动态拉取。[详情](/docs/api#select) 另外也可以用 `$xxxx` 来获取当前作用域中的变量。
|
||||
- `source` Api 地址,如果选项不固定,可以通过配置 `source` 动态拉取。 另外也可以用 `$xxxx` 来获取当前作用域中的变量。
|
||||
- `joinValues` 默认为 `true`
|
||||
- 单选模式:当用户选中某个选项时,选项中的 value 将被作为该表单项的值提交,否则,整个选项对象都会作为该表单项的值提交。
|
||||
- 多选模式:选中的多个选项的 `value` 会通过 `delimiter` 连接起来,否则直接将以数组的形式提交值。
|
||||
- `extractValue` 默认为 `false`, `joinValues`设置为`false`时生效, 开启后将选中的选项 value 的值封装为数组,作为当前表单项的值。
|
||||
- `delimiter` 默认为 `,`
|
||||
- `modalMode` 设置 `dialog` 或者 `drawer`,用来配置弹出方式。
|
||||
- `pickerSchema` 默认为 `{mode: 'list', listItem: {title: '${label}'}}`, 即用 List 类型的渲染,来展示列表信息。更多的玩法请参考 [CRUD](#crud) 的配置。
|
||||
- 更多配置请参考 [FormItem](#FormItem)
|
||||
- `pickerSchema` 默认为 `{mode: 'list', listItem: {title: '${label}'}}`, 即用 List 类型的渲染,来展示列表信息。更多的玩法请参考 [CRUD](./CRUD.md) 的配置。
|
||||
- 更多配置请参考 [FormItem](./FormItem.md)
|
||||
|
||||
```schema:height="300" scope="form-item"
|
||||
{
|
||||
|
|
|
@ -6,9 +6,9 @@
|
|||
- `options` 选项配置,类型为数组,成员格式如下。
|
||||
- `label` 文字
|
||||
- `value` 值
|
||||
- `source` Api 地址,如果选项不固定,可以通过配置 `source` 动态拉取。[详情](/docs/api#select)
|
||||
- `source` Api 地址,如果选项不固定,可以通过配置 `source` 动态拉取。
|
||||
- `columnsCount` 默认为 `1` 可以配置成一行显示多个。
|
||||
- 更多配置请参考 [FormItem](#FormItem)
|
||||
- 更多配置请参考 [FormItem](./FormItem.md)
|
||||
|
||||
```schema:height="330" scope="form"
|
||||
[
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
- `type` 请设置成 `repeat`
|
||||
- `options` 默认: `hourly,daily,weekly,monthly`, 可用配置 `secondly,minutely,hourly,daily,weekdays,weekly,monthly,yearly`
|
||||
- `placeholder` 默认为 `不重复`, 当不指定值时的说明。
|
||||
- 更多配置请参考 [FormItem](#FormItem)
|
||||
- 更多配置请参考 [FormItem](./FormItem.md)
|
||||
|
||||
```schema:height="300" scope="form-item"
|
||||
{
|
||||
|
|
|
@ -34,7 +34,7 @@
|
|||
```
|
||||
|
||||
- `options` Object 类型,给富文本的配置信息。请参考 https://www.froala.com/wysiwyg-editor/docs/options
|
||||
- 更多配置请参考 [FormItem](#FormItem)
|
||||
- 更多配置请参考 [FormItem](./FormItem.md)
|
||||
|
||||
```schema:height="350" scope="form-item"
|
||||
{
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
- `options` 选项配置,类型为数组,成员格式如下。
|
||||
- `label` 文字
|
||||
- `value` 值
|
||||
- `source` Api 地址,如果选项不固定,可以通过配置 `source` 动态拉取。[详情](/docs/api#select) 另外也可以用 `$xxxx` 来获取当前作用域中的变量。
|
||||
- `source` Api 地址,如果选项不固定,可以通过配置 `source` 动态拉取。另外也可以用 `$xxxx` 来获取当前作用域中的变量。
|
||||
- `autoComplete` 跟 source 不同的是,每次用户输入都会去接口获取提示。
|
||||
- `multiple` 默认为 `false`, 设置成 `true` 表示可多选。
|
||||
- `joinValues` 默认为 `true`
|
||||
|
@ -16,7 +16,7 @@
|
|||
- `delimiter` 默认为 `,`
|
||||
- `clearable` 默认为 `false`, 当设置为 `true` 时,已选中的选项右侧会有个小 `X` 用来取消设置。
|
||||
- `searchable` 默认为 `false`,表示可以通过输入部分内容检索出选项。
|
||||
- 更多配置请参考 [FormItem](#FormItem)
|
||||
- 更多配置请参考 [FormItem](./FormItem.md)
|
||||
|
||||
单选
|
||||
|
||||
|
|
|
@ -4,18 +4,18 @@
|
|||
该组件初始化时就会自动拉取一次数据,后续如果需要刷新,请结合 Action 实现,可以把 Action 的 actionType 设置为 reload, target 为该组件的 name 值。
|
||||
同时该组件,还支持 api 数值自动监听,比如 `getData?type=$type` 只要当前环境 type 值发生变化,就会自动重新拉取。
|
||||
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| ------------------- | ----------------------- | ----------- | ----------------------------------------- |
|
||||
| type | `string` | `"service"` | 指定为 service 渲染器 |
|
||||
| className | `string` | | 外层 Dom 的类名 |
|
||||
| body | [Container](#container) | | 内容容器 |
|
||||
| api | [api](#api) | | 数据源 API 地址 |
|
||||
| initFetch | `boolean` | | 是否默认拉取 |
|
||||
| schemaApi | [api](#api) | | 用来获取远程 Schema 的 api |
|
||||
| initFetchSchema | `boolean` | | 是否默认拉取 Schema |
|
||||
| interval | `number` | `3000` | 刷新时间(最低 3000) |
|
||||
| silentPolling | `boolean` | `false` | 配置刷新时是否显示加载动画 |
|
||||
| stopAutoRefreshWhen | `string` | `""` | 通过[表达式](#表达式)来配置停止刷新的条件 |
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| ------------------- | --------------------------------- | ----------- | --------------------------------------------------- |
|
||||
| type | `string` | `"service"` | 指定为 service 渲染器 |
|
||||
| className | `string` | | 外层 Dom 的类名 |
|
||||
| body | [Container](./Types.md#container) | | 内容容器 |
|
||||
| api | [api](./Types.md#Api) | | 数据源 API 地址 |
|
||||
| initFetch | `boolean` | | 是否默认拉取 |
|
||||
| schemaApi | [api](./Types.md#Api) | | 用来获取远程 Schema 的 api |
|
||||
| initFetchSchema | `boolean` | | 是否默认拉取 Schema |
|
||||
| interval | `number` | `3000` | 刷新时间(最低 3000) |
|
||||
| silentPolling | `boolean` | `false` | 配置刷新时是否显示加载动画 |
|
||||
| stopAutoRefreshWhen | `string` | `""` | 通过[表达式](./Types.md#表达式)来配置停止刷新的条件 |
|
||||
|
||||
```schema:height="200" scope="body"
|
||||
{
|
||||
|
|
|
@ -11,12 +11,12 @@
|
|||
- `inline` 是否为 inline 模式。
|
||||
- `className` 表单最外层类名。
|
||||
- `visible` 是否可见。
|
||||
- `visibleOn` 通过[表达式](#表达式)来配置当前表单项是否显示。
|
||||
- `visibleOn` 通过[表达式](./Types.md#表达式)来配置当前表单项是否显示。
|
||||
- `hidden` 是否隐藏,不要跟 `visible` `visibleOn` 同时配置
|
||||
- `hiddenOn` 通过[表达式](#表达式)来配置当前表单项是否隐藏。
|
||||
- `hiddenOn` 通过[表达式](./Types.md#表达式)来配置当前表单项是否隐藏。
|
||||
- `inputClassName` 表单控制器类名。
|
||||
- `labelClassName` label 的类名。
|
||||
- `tpl` 如果想一次展示多条数据,可以考虑用 `tpl`,模板引擎是 lodash template,同时你还可以简单用 `$` 取值。 具体请查看 [tpl](#tpl)
|
||||
- `tpl` 如果想一次展示多条数据,可以考虑用 `tpl`,模板引擎是 lodash template,同时你还可以简单用 `$` 取值。 具体请查看 [tpl](./Tpl.md)
|
||||
|
||||
```schema:height="250" scope="form-item"
|
||||
{
|
||||
|
@ -31,7 +31,7 @@
|
|||
|
||||
- `type` 请设置成 `static-tpl`、`static-plain`、`static-json`、`static-date`、`static-datetime`、`static-time`、`static-mapping`、`static-image`、`static-progress`、`static-status`或者`static-switch`
|
||||
|
||||
纯用来展示数据的,用法跟 crud 里面的[Column](#column)一样, 且支持 quickEdit 和 popOver 功能。
|
||||
纯用来展示数据的,用法跟 crud 里面的[Column](.Column.md)一样, 且支持 quickEdit 和 popOver 功能。
|
||||
|
||||
```schema:height="250" scope="form-item"
|
||||
{
|
||||
|
|
|
@ -12,8 +12,8 @@ formItem 还可以是子表单类型。
|
|||
- `editButtonClassName` 修改按钮 CSS 类名 默认:`btn-info btn-addon btn-sm`。
|
||||
- `form` 字表单的配置
|
||||
`title` 标题
|
||||
`controls` 请参考 [Form](#/form) 中的配置说明。
|
||||
- 更多配置请参考 [FormItem](#FormItem)
|
||||
`controls` 请参考 [Form](./Form.md) 中的配置说明。
|
||||
- 更多配置请参考 [FormItem](./FormItem.md)
|
||||
|
||||
```schema:height="400" scope="form"
|
||||
[
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
- `option` 选项说明
|
||||
- `trueValue` 默认 `true`
|
||||
- `falseValue` 默认 `false`
|
||||
- 更多配置请参考 [FormItem](#FormItem)
|
||||
- 更多配置请参考 [FormItem](./FormItem.md)
|
||||
|
||||
```schema:height="200" scope="form-item"
|
||||
{
|
||||
|
|
|
@ -2,20 +2,20 @@
|
|||
|
||||
表格展示。
|
||||
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| ---------------- | -------------------------- | ------------------------ | ------------------------------------------------------- |
|
||||
| type | `string` | | `"table"` 指定为 table 渲染器 |
|
||||
| title | `string` | | 标题 |
|
||||
| source | `string` | `${items}` | 数据源, 绑定当前环境变量 |
|
||||
| affixHeader | `boolean` | `true` | 是否固定表头 |
|
||||
| columnsTogglable | `auto` 或者 `boolean` | `auto` | 展示列显示开关, 自动即:列数量大于或等于 5 个时自动开启 |
|
||||
| placeholder | string | ‘暂无数据’ | 当没数据的时候的文字提示 |
|
||||
| className | `string` | `panel-default` | 外层 CSS 类名 |
|
||||
| tableClassName | `string` | `table-db table-striped` | 表格 CSS 类名 |
|
||||
| headerClassName | `string` | `crud-table-header` | 顶部外层 CSS 类名 |
|
||||
| footerClassName | `string` | `crud-table-footer` | 底部外层 CSS 类名 |
|
||||
| toolbarClassName | `string` | `crud-table-toolbar` | 工具栏 CSS 类名 |
|
||||
| columns | Array of [Column](#column) | | 用来设置列信息 |
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| ---------------- | ----------------------------- | ------------------------- | ------------------------------------------------------- |
|
||||
| type | `string` | | `"table"` 指定为 table 渲染器 |
|
||||
| title | `string` | | 标题 |
|
||||
| source | `string` | `${items}` | 数据源, 绑定当前环境变量 |
|
||||
| affixHeader | `boolean` | `true` | 是否固定表头 |
|
||||
| columnsTogglable | `auto` 或者 `boolean` | `auto` | 展示列显示开关, 自动即:列数量大于或等于 5 个时自动开启 |
|
||||
| placeholder | string | ‘暂无数据’ | 当没数据的时候的文字提示 |
|
||||
| className | `string` | `panel-default` | 外层 CSS 类名 |
|
||||
| tableClassName | `string` | `table-db table-striped` | 表格 CSS 类名 |
|
||||
| headerClassName | `string` | `Action.md-table-header` | 顶部外层 CSS 类名 |
|
||||
| footerClassName | `string` | `Action.md-table-footer` | 底部外层 CSS 类名 |
|
||||
| toolbarClassName | `string` | `Action.md-table-toolbar` | 工具栏 CSS 类名 |
|
||||
| columns | Array of [Column](.Column.md) | | 用来设置列信息 |
|
||||
|
||||
```schema:height="700" scope="body"
|
||||
{
|
||||
|
|
|
@ -27,30 +27,30 @@
|
|||
}
|
||||
```
|
||||
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| ----------------- | ----------- | --------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------- |
|
||||
| type | `string` | `"tasks"` | 指定为 Tasks 渲染器 |
|
||||
| className | `string` | | 外层 Dom 的类名 |
|
||||
| tableClassName | `string` | | table Dom 的类名 |
|
||||
| items | `Array` | | 任务列表 |
|
||||
| items[x].label | `string` | | 任务名称 |
|
||||
| items[x].key | `string` | | 任务键值,请唯一区分 |
|
||||
| items[x].remark | `string` | | 当前任务状态,支持 html |
|
||||
| items[x].status | `string` | | 任务状态: 0: 初始状态,不可操作。1: 就绪,可操作状态。2: 进行中,还没有结束。3:有错误,不可重试。4: 已正常结束。5:有错误,且可以重试。 |
|
||||
| checkApi | [api](#api) | | 返回任务列表,返回的数据请参考 items。 |
|
||||
| submitApi | [api](#api) | | 提交任务使用的 API |
|
||||
| reSubmitApi | [api](#api) | | 如果任务失败,且可以重试,提交的时候会使用此 API |
|
||||
| interval | `number` | `3000` | 当有任务进行中,会每隔一段时间再次检测,而时间间隔就是通过此项配置,默认 3s。 |
|
||||
| taskNameLabel | `string` | 任务名称 | 任务名称列说明 |
|
||||
| operationLabel | `string` | 操作 | 操作列说明 |
|
||||
| statusLabel | `string` | 状态 | 状态列说明 |
|
||||
| remarkLabel | `string` | 备注 | 备注列说明 |
|
||||
| btnText | `string` | 上线 | 操作按钮文字 |
|
||||
| retryBtnText | `string` | 重试 | 重试操作按钮文字 |
|
||||
| btnClassName | `string` | `btn-sm btn-default` | 配置容器按钮 className |
|
||||
| retryBtnClassName | `string` | `btn-sm btn-danger` | 配置容器重试按钮 className |
|
||||
| statusLabelMap | `array` | `["label-warning", "label-info", "label-success", "label-danger", "label-default", "label-danger"]` | 状态显示对应的类名配置 |
|
||||
| statusTextMap | `array` | `["未开始", "就绪", "进行中", "出错", "已完成", "出错"]` | 状态显示对应的文字显示配置 |
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| ----------------- | --------------------- | --------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------- |
|
||||
| type | `string` | `"tasks"` | 指定为 Tasks 渲染器 |
|
||||
| className | `string` | | 外层 Dom 的类名 |
|
||||
| tableClassName | `string` | | table Dom 的类名 |
|
||||
| items | `Array` | | 任务列表 |
|
||||
| items[x].label | `string` | | 任务名称 |
|
||||
| items[x].key | `string` | | 任务键值,请唯一区分 |
|
||||
| items[x].remark | `string` | | 当前任务状态,支持 html |
|
||||
| items[x].status | `string` | | 任务状态: 0: 初始状态,不可操作。1: 就绪,可操作状态。2: 进行中,还没有结束。3:有错误,不可重试。4: 已正常结束。5:有错误,且可以重试。 |
|
||||
| checkApi | [api](./Types.md#api) | | 返回任务列表,返回的数据请参考 items。 |
|
||||
| submitApi | [api](./Types.md#api) | | 提交任务使用的 API |
|
||||
| reSubmitApi | [api](./Types.md#api) | | 如果任务失败,且可以重试,提交的时候会使用此 API |
|
||||
| interval | `number` | `3000` | 当有任务进行中,会每隔一段时间再次检测,而时间间隔就是通过此项配置,默认 3s。 |
|
||||
| taskNameLabel | `string` | 任务名称 | 任务名称列说明 |
|
||||
| operationLabel | `string` | 操作 | 操作列说明 |
|
||||
| statusLabel | `string` | 状态 | 状态列说明 |
|
||||
| remarkLabel | `string` | 备注 | 备注列说明 |
|
||||
| btnText | `string` | 上线 | 操作按钮文字 |
|
||||
| retryBtnText | `string` | 重试 | 重试操作按钮文字 |
|
||||
| btnClassName | `string` | `btn-sm btn-default` | 配置容器按钮 className |
|
||||
| retryBtnClassName | `string` | `btn-sm btn-danger` | 配置容器重试按钮 className |
|
||||
| statusLabelMap | `array` | `["label-warning", "label-info", "label-success", "label-danger", "label-default", "label-danger"]` | 状态显示对应的类名配置 |
|
||||
| statusTextMap | `array` | `["未开始", "就绪", "进行中", "出错", "已完成", "出错"]` | 状态显示对应的文字显示配置 |
|
||||
|
||||
```schema:height="300" scope="body"
|
||||
[
|
||||
|
|
|
@ -16,7 +16,7 @@
|
|||
|
||||
可用单位: `min`、`hour`、`day`、`week`、`month`、`year`。所有单位支持复数形式。
|
||||
|
||||
- 更多配置请参考 [FormItem](#FormItem)
|
||||
- 更多配置请参考 [FormItem](./FormItem.md)
|
||||
|
||||
```schema:height="250" scope="form"
|
||||
[
|
||||
|
|
|
@ -75,7 +75,7 @@ tpl 类型的渲染器支持用 JS 模板引擎来组织输出,采用的 lodas
|
|||
- `html2ubb` 我想你应该不需要,贴吧定制的 ubb 格式。
|
||||
- `split` 可以将字符传通过分隔符分离成数组,默认分隔符为 `,` 如: `${ids|split|last}` 即取一段用逗号分割的数值中的最后一个。
|
||||
- `nth` 取数组中的第 n 个成员。如: `${ids|split|nth:1}`
|
||||
- `str2date` 请参考 [date](#date) 中日期默认值的设置格式。
|
||||
- `str2date` 请参考 [date](./Date.md) 中日期默认值的设置格式。
|
||||
- `duration` 格式化成时间端如:`2` -=> `2秒` `67` => `1分7秒` `1111111` => `13天21时39分31秒`
|
||||
- `asArray` 将数据包成数组如: `a` => `[a]`
|
||||
- `lowerCase` 转小写
|
||||
|
|
|
@ -3,8 +3,8 @@
|
|||
树形结构输入框。
|
||||
|
||||
- `type` 请设置成 `tree`
|
||||
- `options` 类似于 [select](#select) 中 `options`, 并且支持通过 `children` 无限嵌套。
|
||||
- `source` Api 地址,如果选项不固定,可以通过配置 `source` 动态拉取。[详情](/docs/api#tree)
|
||||
- `options` 类似于 [select](./Select.md) 中 `options`, 并且支持通过 `children` 无限嵌套。
|
||||
- `source` Api 地址,如果选项不固定,可以通过配置 `source` 动态拉取。
|
||||
- `hideRoot` 默认是会显示一个顶级,如果不想显示,请设置 `false`
|
||||
- `rootLabel` 默认为 `顶级`,当 hideRoot 不为 `false` 时有用,用来设置顶级节点的文字。
|
||||
- `showIcon` 是否显示投标,默认为 `true`。
|
||||
|
@ -17,7 +17,7 @@
|
|||
- 多选模式:选中的多个选项的 `value` 会通过 `delimiter` 连接起来,否则直接将以数组的形式提交值。
|
||||
- `extractValue` 默认为 `false`, `joinValues`设置为`false`时生效, 开启后将选中的选项 value 的值封装为数组,作为当前表单项的值。
|
||||
- `delimiter` 默认为 `,`
|
||||
- 更多配置请参考 [FormItem](#FormItem)
|
||||
- 更多配置请参考 [FormItem](./FormItem.md)
|
||||
|
||||
```schema:height="300" scope="form-item"
|
||||
{
|
||||
|
|
|
@ -3,8 +3,8 @@
|
|||
树形结构选择框。
|
||||
|
||||
- `type` 请设置成 `tree-select`
|
||||
- `options` 类似于 [select](#select) 中 `options`, 并且支持通过 `children` 无限嵌套。
|
||||
- `source` Api 地址,如果选项不固定,可以通过配置 `source` 动态拉取。[详情](/docs/api#tree)
|
||||
- `options` 类似于 [select](./Select.md) 中 `options`, 并且支持通过 `children` 无限嵌套。
|
||||
- `source` Api 地址,如果选项不固定,可以通过配置 `source` 动态拉取。
|
||||
- `hideRoot` 默认是会显示一个顶级,如果不想显示,请设置 `false`
|
||||
- `rootLabel` 默认为 `顶级`,当 hideRoot 不为 `false` 时有用,用来设置顶级节点的文字。
|
||||
- `showIcon` 是否显示投标,默认为 `true`。
|
||||
|
@ -17,7 +17,7 @@
|
|||
- 多选模式:选中的多个选项的 `value` 会通过 `delimiter` 连接起来,否则直接将以数组的形式提交值。
|
||||
- `extractValue` 默认为 `false`, `joinValues`设置为`false`时生效, 开启后将选中的选项 value 的值封装为数组,作为当前表单项的值。
|
||||
- `delimiter` 默认为 `,`
|
||||
- 更多配置请参考 [FormItem](#FormItem)
|
||||
- 更多配置请参考 [FormItem](./FormItem.md)
|
||||
|
||||
```schema:height="300" scope="form-item"
|
||||
{
|
||||
|
|
|
@ -128,7 +128,7 @@ AMis 所有值为 url 的如: `"http://www.baidu.com"` 都会被替换成 prox
|
|||
### 表达式
|
||||
|
||||
配置项中,所有 `boolean` 类型的配置,都可以用 JS 表达式来配置。所有`boolean` 配置项,后面加个 `On` 则是表达式配置方式,可以用 js 语法来根据当前模型中的数据来决定是否启用。
|
||||
如:[FormItem](#FormItem) 中的 `disabledOn`、`hiddenOn`、`visibleOn`、[CRUD](#CRUD) 中的 `itemDraggableOn` 等等。
|
||||
如:[FormItem](./FormItem.md) 中的 `disabledOn`、`hiddenOn`、`visibleOn`、[CRUD](./CRUD.md) 中的 `itemDraggableOn` 等等。
|
||||
|
||||
```schema:height="300" scope="form"
|
||||
[
|
||||
|
|
|
@ -19,7 +19,7 @@
|
|||
- `target` 可以把数据提交给别的组件而不是自己保存。请填写目标组件设置的 name 值,如果填写为 `window` 则把数据同步到地址栏上,同时依赖这些数据的组件会自动重新刷新。
|
||||
- `steps` 数组,配置步骤信息。
|
||||
- `steps[x].title` 步骤标题。
|
||||
- `steps[x].mode` 展示默认,跟 [Form](#form) 中的模式一样,选择: `normal`、`horizontal`或者`inline`。
|
||||
- `steps[x].mode` 展示默认,跟 [Form](./Form.md) 中的模式一样,选择: `normal`、`horizontal`或者`inline`。
|
||||
- `steps[x].horizontal` 当为水平模式时,用来控制左右占比。
|
||||
- `steps[x].horizontal.label` 左边 label 的宽度占比。
|
||||
- `steps[x].horizontal.right` 右边控制器的宽度占比。
|
||||
|
@ -28,7 +28,7 @@
|
|||
- `steps[x].initApi` 当前步骤数据初始化接口。
|
||||
- `steps[x].initFetch` 当前步骤数据初始化接口是否初始拉取。
|
||||
- `steps[x].initFetchOn` 当前步骤数据初始化接口是否初始拉取,用表达式来决定。
|
||||
- `steps[x].controls` 当前步骤的表单项集合,请参考 [FormItem](#formitem)。
|
||||
- `steps[x].controls` 当前步骤的表单项集合,请参考 [FormItem](./FormItem.md)。
|
||||
|
||||
```schema:height="400" scope="body"
|
||||
{
|
||||
|
|
|
@ -2,12 +2,12 @@
|
|||
|
||||
简单的一个容器。
|
||||
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| --------- | ----------------------- | ----------- | ---------------------------- |
|
||||
| type | `string` | `"wrapper"` | 指定为 Wrapper 渲染器 |
|
||||
| className | `string` | | 外层 Dom 的类名 |
|
||||
| size | `string` | | 支持: `xs`、`sm`、`md`和`lg` |
|
||||
| body | [Container](#container) | | 内容容器 |
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| --------- | --------------------------------- | ----------- | ---------------------------- |
|
||||
| type | `string` | `"wrapper"` | 指定为 Wrapper 渲染器 |
|
||||
| className | `string` | | 外层 Dom 的类名 |
|
||||
| size | `string` | | 支持: `xs`、`sm`、`md`和`lg` |
|
||||
| body | [Container](./Types.md#container) | | 内容容器 |
|
||||
|
||||
```schema:height="200" scope="body"
|
||||
{
|
||||
|
|
Loading…
Reference in New Issue