mirror of
https://gitee.com/baidu/amis.git
synced 2024-12-04 04:48:32 +08:00
文档调整
This commit is contained in:
liaoxuezhi
parent
a1cb995aa3
commit
a76af28a2a
@ -2,6 +2,22 @@
|
||||
|
||||
Action 是一种特殊的渲染器，它本身是一个按钮，同时它能触发事件。
|
||||
|
||||
```schema:height="100" scope="body"
|
||||
{
|
||||
"label": "弹个框",
|
||||
"type": "button",
|
||||
"level": "dark",
|
||||
"actionType": "dialog",
|
||||
"dialog": {
|
||||
"title": "弹框",
|
||||
"body": "这是个简单的弹框。"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
除了能弹框，它还能设定很多行为比如：提交表单、发送 ajax、页面跳转、关闭弹框、复制文本等等。
|
||||
|
||||
|
||||
### 通用配置项
|
||||
所有`actionType`都支持的通用配置项
|
||||
|
||||
@ -23,6 +39,9 @@ Action 是一种特殊的渲染器，它本身是一个按钮，同时它能触
|
||||
| tooltip | `string` | - | 鼠标停留时弹出该段文字，也可以配置对象类型：字段为`title`和`content`。可用 `${xxx}` 取值。 |
|
||||
| disabledTip | `string` | - | 被禁用后鼠标停留时弹出该段文字，也可以配置对象类型：字段为`title`和`content`。可用 `${xxx}` 取值。 |
|
||||
| tooltipPlacement | `string` | `top` | 如果配置了`tooltip`或者`disabledTip`，指定提示信息位置，可配置`top`、`bottom`、`left`、`right`。 |
|
||||
| close | `boolean` | - | 当`action`配置在`dialog`或`drawer`的`actions`中时，配置为`true`指定此次操作完后关闭当前`dialog`或`drawer`。 |
|
||||
| required | `Array<string>` | - | 配置字符串数组，指定在`form`中进行操作之前，需要指定的字段名的表单项通过验证 |
|
||||
|
||||
|
||||
下面会分别介绍每种类型的Action配置项
|
||||
|
||||
@ -35,12 +54,42 @@ Action 是一种特殊的渲染器，它本身是一个按钮，同时它能触
|
||||
| feedback | `DialogObject` | - | 如果 ajax 类型的，当 ajax 返回正常后，还能接着弹出一个 dialog 做其他交互。返回的数据可用于这个 dialog 中。格式可参考[Dialog](./Dialog.md) |
|
||||
| messages | `object` | - | `success`：ajax 操作成功后提示，可以不指定，不指定时以 api 返回为准。`failed`：ajax 操作失败提示。 |
|
||||
|
||||
```schema:height="200"
|
||||
{
|
||||
"data": {
|
||||
"user": "no one"
|
||||
},
|
||||
"body": {
|
||||
"label": "Post",
|
||||
"type": "button",
|
||||
"actionType": "ajax",
|
||||
"confirmText": "确定？",
|
||||
"api": "/api/mock2/form/saveForm",
|
||||
"messages": {
|
||||
"success": "发送成功"
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### link
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| ---------- | -------- | ------ | ------------------------------------------------------------------------------------------------------------------- |
|
||||
| actionType | `string` | `link` | 单页跳转 |
|
||||
| link | `string` | `link` | 用来指定跳转地址，跟 url 不同的是，这是单页跳转方式，不会渲染浏览器，请指定 amis 平台内的页面。可用 `${xxx}` 取值。 |
|
||||
|
||||
```schema:height="200"
|
||||
{
|
||||
"body": {
|
||||
"label": "进入简介页面",
|
||||
"type": "button",
|
||||
"level": "info",
|
||||
"actionType": "link",
|
||||
"link": "/docs/index"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### url
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| ---------- | --------- | ------- | ------------------------------------------------ |
|
||||
@ -48,6 +97,20 @@ Action 是一种特殊的渲染器，它本身是一个按钮，同时它能触
|
||||
| url | `string` | - | 按钮点击后，会打开指定页面。可用 `${xxx}` 取值。 |
|
||||
| blank | `boolean` | `false` | 如果为 `true` 将在新tab页面打开。 |
|
||||
|
||||
```schema:height="200"
|
||||
{
|
||||
"body": {
|
||||
"label": "打开 Baidu",
|
||||
"type": "button",
|
||||
"level": "success",
|
||||
"actionType": "url",
|
||||
"url": "raw:http://www.baidu.com"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
`注意：由于 amis 平台内 http 地址会被替换成 proxy 地址，所以在 amis 平台内使用请加上 raw: 作为前缀。 比如：raw:http://www.baidu.com`
|
||||
|
||||
### dialog
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| ------------- | -------------------------- | -------- | --------------------------------------------- |
|
||||
@ -55,12 +118,62 @@ Action 是一种特殊的渲染器，它本身是一个按钮，同时它能触
|
||||
| dialog | `string` 或 `DialogObject` | - | 指定弹框内容，格式可参考[Dialog](./Dialog.md) |
|
||||
| nextCondition | `boolean` | - | 可以用来设置下一条数据的条件，默认为 `true`。 |
|
||||
|
||||
```schema:height="200"
|
||||
{
|
||||
"body": {
|
||||
"label": "Dialog Form",
|
||||
"type": "button",
|
||||
"level": "primary",
|
||||
"actionType": "dialog",
|
||||
"dialog": {
|
||||
"title": "表单设置",
|
||||
"body": {
|
||||
"type": "form",
|
||||
"api": "/api/mock2/form/saveForm?waitSeconds=1",
|
||||
"controls": [
|
||||
{
|
||||
"type": "text",
|
||||
"name": "text",
|
||||
"label": "文本"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### drawer
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| ---------- | -------------------------- | -------- | --------------------------------------------- |
|
||||
| actionType | `string` | `drawer` | 点击后显示一个侧边栏 |
|
||||
| drawer | `string` 或 `DrawerObject` | - | 指定弹框内容，格式可参考[Drawer](./Drawer.md) |
|
||||
|
||||
```schema:height="200"
|
||||
{
|
||||
"body": {
|
||||
"label": "Drawer Form",
|
||||
"type": "button",
|
||||
"level": "primary",
|
||||
"actionType": "drawer",
|
||||
"drawer": {
|
||||
"title": "表单设置",
|
||||
"body": {
|
||||
"type": "form",
|
||||
"api": "/api/mock2/form/saveForm?waitSeconds=1",
|
||||
"controls": [
|
||||
{
|
||||
"type": "text",
|
||||
"name": "text",
|
||||
"label": "文本"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### copy
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| ---------- | -------- | ------ | ------------------------------------ |
|
||||
@ -80,113 +193,3 @@ Action 是一种特殊的渲染器，它本身是一个按钮，同时它能触
|
||||
| ---------- | -------- | ------ | ---------------------------------------------------------------------- |
|
||||
| actionType | `string` | `add` | 给指定`FormItem-Table`添加一条数据， |
|
||||
| target | `string` | - | 指定`FormItem-Table`的名字（`Table`的`name`值），多个请用 `,` 号隔开。 |
|
||||
|
||||
### 其他配置项
|
||||
| 属性名 | 类型 | 默认值 | 说明 |
|
||||
| -------- | --------------- | ------- | ----------------------------------------------------------------------------------------------------------- |
|
||||
| close | `boolean` | `false` | 当`action`配置在`dialog`或`drawer`的`actions`中时，配置为`true`指定此次操作完后关闭当前`dialog`或`drawer`。 |
|
||||
| required | `Array<string>` | - | 配置字符串数组，指定在`form`中进行操作之前，需验证必填的表单项字段 |
|
||||
|
||||
示例：
|
||||
|
||||
- `ajax` 当按钮点击时，发送 ajax 请求，发送的数据取决于所在的容器里面。
|
||||
|
||||
```schema:height="200"
|
||||
{
|
||||
"data": {
|
||||
"user": "no one"
|
||||
},
|
||||
"body": {
|
||||
"label": "Post",
|
||||
"type": "button",
|
||||
"actionType": "ajax",
|
||||
"confirmText": "确定？",
|
||||
"api": "/api/mock2/form/saveForm",
|
||||
"messages": {
|
||||
"success": "发送成功"
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
- `link` 当按钮点击后，无刷新进入 amis 内部某个页面。
|
||||
|
||||
```schema:height="200"
|
||||
{
|
||||
"body": {
|
||||
"label": "进入简介页面",
|
||||
"type": "button",
|
||||
"level": "info",
|
||||
"actionType": "link",
|
||||
"link": "/docs/index"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
- `url` 当按钮点击后，新窗口打开指定页面。
|
||||
|
||||
```schema:height="200"
|
||||
{
|
||||
"body": {
|
||||
"label": "打开 Baidu",
|
||||
"type": "button",
|
||||
"level": "success",
|
||||
"actionType": "url",
|
||||
"url": "raw:http://www.baidu.com"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
- `dialog` 当按钮点击后，弹出一个对话框。 关于 dialog 配置，请查看 [Dialog 模型](./Dialog.md)。
|
||||
|
||||
```schema:height="200"
|
||||
{
|
||||
"body": {
|
||||
"label": "Dialog Form",
|
||||
"type": "button",
|
||||
"level": "primary",
|
||||
"actionType": "dialog",
|
||||
"dialog": {
|
||||
"title": "表单设置",
|
||||
"body": {
|
||||
"type": "form",
|
||||
"api": "/api/mock2/form/saveForm?waitSeconds=1",
|
||||
"controls": [
|
||||
{
|
||||
"type": "text",
|
||||
"name": "text",
|
||||
"label": "文本"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
- `drawer` 当按钮点击后，弹出一个抽出式对话框。 关于 drawer 配置，请查看 [Drawer 模型](./Drawer.md)。
|
||||
|
||||
```schema:height="200"
|
||||
{
|
||||
"body": {
|
||||
"label": "Drawer Form",
|
||||
"type": "button",
|
||||
"level": "primary",
|
||||
"actionType": "drawer",
|
||||
"drawer": {
|
||||
"title": "表单设置",
|
||||
"body": {
|
||||
"type": "form",
|
||||
"api": "/api/mock2/form/saveForm?waitSeconds=1",
|
||||
"controls": [
|
||||
{
|
||||
"type": "text",
|
||||
"name": "text",
|
||||
"label": "文本"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
@ -13,8 +13,7 @@
|
||||
{
|
||||
"type": "alert",
|
||||
"body": "这是一段提示",
|
||||
"level": "warning",
|
||||
"showCloseButton": true
|
||||
"level": "warning"
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user