文档更新

This commit is contained in:
catchonme 2019-05-28 19:18:49 +08:00
parent d3af4e0f5d
commit 41f2e750ca
13 changed files with 23 additions and 22 deletions

View File

@ -33,7 +33,7 @@ shortname: advanced
- form 中弹出则会把 form 中的数据复制份传给 dialog。 - form 中弹出则会把 form 中的数据复制份传给 dialog。
- crud 中的批量操作按钮。把整个列表数据复制给 dialog。 - crud 中的批量操作按钮。把整个列表数据复制给 dialog。
- crud 中的某一项中的按钮,则只会把对应的那一条数据拷贝给 dialog。 - crud 中的某一项中的按钮,则只会把对应的那一条数据拷贝给 dialog。
- `servcie` - `service`
- 父级 容器中的数据可以直接使用,如 page 容器 - 父级 容器中的数据可以直接使用,如 page 容器
- 如果配置了 `api`, `api` 返回的数据可以用。 - 如果配置了 `api`, `api` 返回的数据可以用。

View File

@ -20,7 +20,6 @@ amis 页面是通过 JSON 配置出来的,是由一个一个渲染模型组成
- [Email](./renderers/Form/Email.md): Email 输入框 - [Email](./renderers/Form/Email.md): Email 输入框
- [Password](./renderers/Form/Password.md): 密码输入框 - [Password](./renderers/Form/Password.md): 密码输入框
- [Number](./renderers/Form/Number.md): 数字输入框 - [Number](./renderers/Form/Number.md): 数字输入框
- [Divider](./renderers/Form/Divider.md): 分割线
- [Select](./renderers/Form/Select.md): 选项表单 - [Select](./renderers/Form/Select.md): 选项表单
- [Chained-Select](./renderers/Form/Chained-Select.md): 无限级别下拉 - [Chained-Select](./renderers/Form/Chained-Select.md): 无限级别下拉
- [Checkbox](./renderers/Form/Checkbox.md): 勾选框 - [Checkbox](./renderers/Form/Checkbox.md): 勾选框
@ -59,6 +58,7 @@ amis 页面是通过 JSON 配置出来的,是由一个一个渲染模型组成
- [Action](./renderers/Action.md): 一种特殊的渲染器,它本身是一个按钮,同时它能触发事件 - [Action](./renderers/Action.md): 一种特殊的渲染器,它本身是一个按钮,同时它能触发事件
- [Dialog](./renderers/Dialog.md): Dialog 由 Action 触发。他是一个类似于 Page 的容器模型 - [Dialog](./renderers/Dialog.md): Dialog 由 Action 触发。他是一个类似于 Page 的容器模型
- [Drawer](./renderers/Drawer.md): Drawer 由 Action 触发 - [Drawer](./renderers/Drawer.md): Drawer 由 Action 触发
- [Divider](./renderers/Divider.md): 分割线
- [CRUD](./renderers/CRUD.md): 增删改查模型,主要用来展现列表 - [CRUD](./renderers/CRUD.md): 增删改查模型,主要用来展现列表
- [CRUD-Table](./renderers/CRUD-Table.md): 请参考 Table - [CRUD-Table](./renderers/CRUD-Table.md): 请参考 Table
- [CRUD-Cards](./renderers/CRUD-Cards.md): 请参考 Cards - [CRUD-Cards](./renderers/CRUD-Cards.md): 请参考 Cards

View File

@ -8,7 +8,7 @@ Action 是一种特殊的渲染器,它本身是一个按钮,同时它能触
| 属性名 | 类型 | 默认值 | 说明 | | 属性名 | 类型 | 默认值 | 说明 |
| ---------------- | --------- | ----------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------- | | ---------------- | --------- | ----------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| type | `string` | `action` | 指定为 Page 渲染器。 | | type | `string` | `action` | 指定为 Page 渲染器。 |
| actionType | `string` | - | 【必填】这是action最核心的配置来指定该action的作用类型支持`ajax`、`link`、`url`、`dawer`、`dialog`、`confirm`、`cancel`、`prev`、`next`、`copy`、`close`。 | | actionType | `string` | - | 【必填】这是action最核心的配置来指定该action的作用类型支持`ajax`、`link`、`url`、`drawer`、`dialog`、`confirm`、`cancel`、`prev`、`next`、`copy`、`close`。 |
| label | `string` | - | 按钮文本。可用 `${xxx}` 取值。 | | label | `string` | - | 按钮文本。可用 `${xxx}` 取值。 |
| level | `string` | `default` | 按钮样式,支持:`link`、`primary`、`secondary`、`info`、`success`、`warning`、`danger`、`light`、`dark`、`default`。 | | level | `string` | `default` | 按钮样式,支持:`link`、`primary`、`secondary`、`info`、`success`、`warning`、`danger`、`light`、`dark`、`default`。 |
| size | `string` | - | 按钮大小,支持:`xs`、`sm`、`md`、`lg`。 | | size | `string` | - | 按钮大小,支持:`xs`、`sm`、`md`、`lg`。 |
@ -173,7 +173,7 @@ Action 是一种特殊的渲染器,它本身是一个按钮,同时它能触
"type": "button", "type": "button",
"level": "primary", "level": "primary",
"actionType": "drawer", "actionType": "drawer",
"drawer": {1 "drawer": {
"title": "表单设置", "title": "表单设置",
"body": { "body": {
"type": "form", "type": "form",

View File

@ -4,12 +4,12 @@
- `type` 请设置成 `button` - `type` 请设置成 `button`
- `label` 按钮文字 - `label` 按钮文字
- `icon` 按钮图标。可以使用来自 fontawesome 的图标。 - `icon` 按钮图标。可以使用来自 font-awesome 的图标。
- `level` 按钮级别。 包含: `link`、`primary`、`success`、`info`、`warning`和`danger`。 - `level` 按钮级别。 包含: `link`、`primary`、`success`、`info`、`warning`和`danger`。
- `size` 按钮大小。 包含: `xs`、`sm`、`md`和`lg` - `size` 按钮大小。 包含: `xs`、`sm`、`md`和`lg`
- `className` 按钮的类名。 - `className` 按钮的类名。
如果按钮是 `button` 类型,则还需要配置 [Action](./Action.md) 中定义的属性否则amis 不知道如何响应当前按钮点击。 如果按钮是 `button` 类型,则还需要配置 [Action](../Action.md) 中定义的属性否则amis 不知道如何响应当前按钮点击。
```schema:height="300" scope="form" ```schema:height="300" scope="form"
[ [

View File

@ -6,7 +6,7 @@
- `format` 默认 `X` 即时间戳格式,用来提交的时间格式。更多格式类型请参考 moment. - `format` 默认 `X` 即时间戳格式,用来提交的时间格式。更多格式类型请参考 moment.
- `inputFormat` 默认 `YYYY-MM-DD HH:mm:ss` 用来配置显示的时间格式。 - `inputFormat` 默认 `YYYY-MM-DD HH:mm:ss` 用来配置显示的时间格式。
- `placeholder` 默认 `请选择日期` - `placeholder` 默认 `请选择日期`
- `timeConstraints` 请参考: https://github.com/YouCanBookMe/react-datetime - `timeConstraints` 请参考: [react-datetime](https://github.com/YouCanBookMe/react-datetime)
- `value` 这里面 value 需要特殊说明一下,因为支持相对值。如: - `value` 这里面 value 需要特殊说明一下,因为支持相对值。如:
- `-2mins` 2 分钟前 - `-2mins` 2 分钟前
- `+2days` 2 天后 - `+2days` 2 天后

View File

@ -12,15 +12,15 @@ Form 中主要是由各种 FormItem 组成。FormItem 中主要包含这些字
- `submitOnChange` 是否该表单项值发生变化时就提交当前表单。 - `submitOnChange` 是否该表单项值发生变化时就提交当前表单。
- `className` 表单最外层类名。 - `className` 表单最外层类名。
- `disabled` 当前表单项是否是禁用状态。 - `disabled` 当前表单项是否是禁用状态。
- `disabledOn` 通过[表达式](./Types.md#表达式)来配置当前表单项的禁用状态。 - `disabledOn` 通过[表达式](../Types.md#表达式)来配置当前表单项的禁用状态。
- `visible` 是否可见。 - `visible` 是否可见。
- `visibleOn` 通过[表达式](./Types.md#表达式)来配置当前表单项是否显示。 - `visibleOn` 通过[表达式](../Types.md#表达式)来配置当前表单项是否显示。
- `hidden` 是否隐藏,不要跟 `visible` `visibleOn` 同时配置 - `hidden` 是否隐藏,不要跟 `visible` `visibleOn` 同时配置
- `hiddenOn` 通过[表达式](./Types.md#表达式)来配置当前表单项是否隐藏。 - `hiddenOn` 通过[表达式](../Types.md#表达式)来配置当前表单项是否隐藏。
- `inputClassName` 表单控制器类名。 - `inputClassName` 表单控制器类名。
- `labelClassName` label 的类名。 - `labelClassName` label 的类名。
- `required` 是否为必填。 - `required` 是否为必填。
- `requiredOn` 通过[表达式](./Types.md#表达式)来配置当前表单项是否为必填。 - `requiredOn` 通过[表达式](../Types.md#表达式)来配置当前表单项是否为必填。
- `validations` 格式验证,支持设置多个,多个规则用英文逗号隔开。 - `validations` 格式验证,支持设置多个,多个规则用英文逗号隔开。
- `isEmptyString` 必须是空白字符。 - `isEmptyString` 必须是空白字符。

View File

@ -3,9 +3,9 @@
还是为了布局,可以把一部分 [FormItem](./FormItem.md) 合并到一个 panel 里面单独展示。 还是为了布局,可以把一部分 [FormItem](./FormItem.md) 合并到一个 panel 里面单独展示。
- `title` panel 标题 - `title` panel 标题
- `body` [Container](./Types.md#container) 可以是其他渲染模型。 - `body` [Container](../Types.md#container) 可以是其他渲染模型。
- `bodyClassName` body 的 className. - `bodyClassName` body 的 className.
- `footer` [Container](./Types.md#container) 可以是其他渲染模型。 - `footer` [Container](../Types.md#container) 可以是其他渲染模型。
- `footerClassName` footer 的 className. - `footerClassName` footer 的 className.
- `controls``body` 二选一,如果设置了 controls 优先显示表单集合。 - `controls``body` 二选一,如果设置了 controls 优先显示表单集合。

View File

@ -14,7 +14,7 @@
- `extractValue` 默认为 `false`, `joinValues`设置为`false`时生效, 开启后将选中的选项 value 的值封装为数组,作为当前表单项的值。 - `extractValue` 默认为 `false`, `joinValues`设置为`false`时生效, 开启后将选中的选项 value 的值封装为数组,作为当前表单项的值。
- `delimiter` 默认为 `,` - `delimiter` 默认为 `,`
- `modalMode` 设置 `dialog` 或者 `drawer`,用来配置弹出方式。 - `modalMode` 设置 `dialog` 或者 `drawer`,用来配置弹出方式。
- `pickerSchema` 默认为 `{mode: 'list', listItem: {title: '${label}'}}`, 即用 List 类型的渲染,来展示列表信息。更多的玩法请参考 [CRUD](./CRUD.md) 的配置。 - `pickerSchema` 默认为 `{mode: 'list', listItem: {title: '${label}'}}`, 即用 List 类型的渲染,来展示列表信息。更多的玩法请参考 [CRUD](../CRUD.md) 的配置。
- 更多配置请参考 [FormItem](./FormItem.md) - 更多配置请参考 [FormItem](./FormItem.md)
```schema:height="300" scope="form-item" ```schema:height="300" scope="form-item"

View File

@ -9,6 +9,7 @@
- `multiple` 支持选择范围,默认为`false` - `multiple` 支持选择范围,默认为`false`
- `joinValuse` 默认为 `true`,选择的 `value` 会通过 `delimiter` 连接起来,否则直接将以`{min: 1, max: 100}`的形式提交,开启`multiple`时有效 - `joinValuse` 默认为 `true`,选择的 `value` 会通过 `delimiter` 连接起来,否则直接将以`{min: 1, max: 100}`的形式提交,开启`multiple`时有效
- `delimiter` 默认为 `,` - `delimiter` 默认为 `,`
- 更多配置请参考 [FormItem](./FormItem.md)
```schema:height="400" scope="form-item" ```schema:height="400" scope="form-item"
{ {

View File

@ -55,9 +55,9 @@
| editable | `boolean` | false | 是否可编辑 | | editable | `boolean` | false | 是否可编辑 |
| removable | `boolean` | false | 是否可删除 | | removable | `boolean` | false | 是否可删除 |
| showAddBtn | `boolean` | true | 是否显示添加按钮 | | showAddBtn | `boolean` | true | 是否显示添加按钮 |
| addApi | [api](./Types.md#Api) | - | 新增时提交的 API | | addApi | [api](../Types.md#Api) | - | 新增时提交的 API |
| updateApi | [api](./Types.md#Api) | - | 修改时提交的 API | | updateApi | [api](../Types.md#Api) | - | 修改时提交的 API |
| deleteApi | [api](./Types.md#Api) | - | 删除时提交的 API | | deleteApi | [api](../Types.md#Api) | - | 删除时提交的 API |
| addBtnLabel | `string` | | 增加按钮名称 | | addBtnLabel | `string` | | 增加按钮名称 |
| addBtnIcon | `string` | `"fa fa-plus"` | 增加按钮图标 | | addBtnIcon | `string` | `"fa fa-plus"` | 增加按钮图标 |
| updateBtnLabel | `string` | `""` | 更新按钮名称 | | updateBtnLabel | `string` | `""` | 更新按钮名称 |
@ -73,7 +73,7 @@
| columns[x].quickEditOnUpdate | `boolean` 或者 `object` | - | 可以用来区分新建模式和更新模式的编辑配置 | | columns[x].quickEditOnUpdate | `boolean` 或者 `object` | - | 可以用来区分新建模式和更新模式的编辑配置 |
- 更多配置请参考 [FormItem](./FormItem.md) - 更多配置请参考 [FormItem](./FormItem.md)
- 更多 Demo 详情请参考 [表格编辑](/docs/examples/form/table) - 更多 Demo 详情请参考 [表格编辑](/amis/#/form/table)
```schema:height="250" scope="form-item" ```schema:height="250" scope="form-item"
{ {

View File

@ -6,7 +6,7 @@
- `format` 默认 `X` 即时间戳格式,用来提交的时间格式。更多格式类型请参考 moment. - `format` 默认 `X` 即时间戳格式,用来提交的时间格式。更多格式类型请参考 moment.
- `inputFormat` 默认 `HH:mm` 用来配置显示的时间格式。 - `inputFormat` 默认 `HH:mm` 用来配置显示的时间格式。
- `placeholder` 默认 `请选择日期` - `placeholder` 默认 `请选择日期`
- `timeConstraints` 请参考: https://github.com/YouCanBookMe/react-datetime - `timeConstraints` 请参考: [react-datetime](https://github.com/YouCanBookMe/react-datetime)
- `value` 这里面 value 需要特殊说明一下,因为支持相对值。如: - `value` 这里面 value 需要特殊说明一下,因为支持相对值。如:
- `-2mins` 2 分钟前 - `-2mins` 2 分钟前
- `+2days` 2 天后 - `+2days` 2 天后

View File

@ -19,7 +19,7 @@
| listItem.avatarClassName | `string` | `thumb-sm avatar m-r` | 图片 CSS 类名 | | listItem.avatarClassName | `string` | `thumb-sm avatar m-r` | 图片 CSS 类名 |
| listItem.desc | `string` | | 描述,支持模板语法如: \${xxx} | | listItem.desc | `string` | | 描述,支持模板语法如: \${xxx} |
| listItem.body | `Array` 或者 [Field](./Field.md) | | 内容容器,主要用来放置 [Field](./Field.md) | | listItem.body | `Array` 或者 [Field](./Field.md) | | 内容容器,主要用来放置 [Field](./Field.md) |
| listItem.actions | Array Of [Button](./Button.md) | | 按钮区域 | | listItem.actions | Array Of [Button](./Form/Button.md) | | 按钮区域 |
```schema:height="400" scope="body" ```schema:height="400" scope="body"
{ {

View File

@ -19,7 +19,7 @@
- `target` 可以把数据提交给别的组件而不是自己保存。请填写目标组件设置的 name 值,如果填写为 `window` 则把数据同步到地址栏上,同时依赖这些数据的组件会自动重新刷新。 - `target` 可以把数据提交给别的组件而不是自己保存。请填写目标组件设置的 name 值,如果填写为 `window` 则把数据同步到地址栏上,同时依赖这些数据的组件会自动重新刷新。
- `steps` 数组,配置步骤信息。 - `steps` 数组,配置步骤信息。
- `steps[x].title` 步骤标题。 - `steps[x].title` 步骤标题。
- `steps[x].mode` 展示默认,跟 [Form](./Form.md) 中的模式一样,选择: `normal`、`horizontal`或者`inline`。 - `steps[x].mode` 展示默认,跟 [Form](./Form/Form.md) 中的模式一样,选择: `normal`、`horizontal`或者`inline`。
- `steps[x].horizontal` 当为水平模式时,用来控制左右占比。 - `steps[x].horizontal` 当为水平模式时,用来控制左右占比。
- `steps[x].horizontal.label` 左边 label 的宽度占比。 - `steps[x].horizontal.label` 左边 label 的宽度占比。
- `steps[x].horizontal.right` 右边控制器的宽度占比。 - `steps[x].horizontal.right` 右边控制器的宽度占比。
@ -28,7 +28,7 @@
- `steps[x].initApi` 当前步骤数据初始化接口。 - `steps[x].initApi` 当前步骤数据初始化接口。
- `steps[x].initFetch` 当前步骤数据初始化接口是否初始拉取。 - `steps[x].initFetch` 当前步骤数据初始化接口是否初始拉取。
- `steps[x].initFetchOn` 当前步骤数据初始化接口是否初始拉取,用表达式来决定。 - `steps[x].initFetchOn` 当前步骤数据初始化接口是否初始拉取,用表达式来决定。
- `steps[x].controls` 当前步骤的表单项集合,请参考 [FormItem](./FormItem.md)。 - `steps[x].controls` 当前步骤的表单项集合,请参考 [FormItem](./Form/FormItem.md)。
```schema:height="400" scope="body" ```schema:height="400" scope="body"
{ {