2022-01-26 21:18:55 +08:00
|
|
|
|
{"docs":[{"title":"Action 行为按钮","body":"\nAction 行为按钮,是触发页面行为的主要方法之一\n\n## 基本用法\n\n我们这里简单实现一个点击按钮弹框的交互。\n\n\n\n## 样式\n\n### 尺寸\n\n配置`size`,显示不同尺寸\n\n\n\n### 主题\n\n可以配置`level`或者`primary`,显示不同样式。\n\n\n\n### 图标\n\n可以配置`icon`配置项,实现按钮显示图标\n\n\n\nicon 也可以是 url 地址,比如\n\n\n\n如果`label`配置为空字符串,可以只显示`icon`\n\n\n\n## 操作前确认\n\n可以通过配置`confirmText`,实现在任意操作前,弹出提示框确认是否进行该操作。\n\n\n\n## ajax 请求\n\n通过配置`\"actionType\":\"ajax\"`和`api`,可以实现 ajax 请求。\n\n\n\n### 请求成功后,跳转至某个页面\n\n##### 配置相对路径,实现单页跳转\n\n\n\n##### 配置完整路径,直接跳转指定路径\n\n\n\n### 请求成功后,显示反馈弹框\n\n\n\n更多内容查看\n\n### 请求成功后,刷新目标组件\n\n1. 目标组件需要配置 `name` 属性\n2. Action 上添加 `\"reload\": \"xxx\"`,`xxx` 为目标组件的 `name` 属性值,如果配置多个组件,`name` 用逗号分隔,另外如果想让 reload 的时候再携带些数据可以类似这样配置 `{\"reload\": \"xxx?a=${a}&b=${b}\"}`, 这样不仅让目标组件刷新,同时还会把当前环境中的数据 a 和 b 传递给 xxx.\n\n\n\n> 配置 `\"reload\": \"window\"` 可刷新当前页面\n\n### 自定义 toast 文字\n\n可以通过配置`messages`,自定义接口返回`toast`信息\n\n\n\n需要注意如果 api 结果返回了 `msg` 字段,会优先使用 api 的返回。\n\n**属性表**\n\n| 属性名 | 类型 | 默认值 | 说明 |\n| -------- | ---------------------------------------------------------------------------------------- | ------ | ----------------------------------------------------------------------------------------------------------------------------------------- |\n| api | 格式说明。 |\n| redirect | | - | 指定当前请求结束后跳转的路径,可用 `${xxx}` 取值。 |\n| feedback | `DialogObject` | - | 如果 ajax 类型的,当 ajax 返回正常后,还能接着弹出一个 dialog 做其他交互。返回的数据可用于这个 dialog 中。格式可参考 |\n| messages | `object` | - | `success`:ajax 操作成功后提示,可以不指定,不指定时以 api 返回为准。`failed`:ajax 操作失败提示。 |\n\n## 下载请求\n\n> 1.4.0 及以上版本\n\n通过配置 `\"actionType\":\"download\"` 和 `api`,可以实现下载请求,它其实是 `ajax` 的一种特例,自动给 api 加上了 `\"responseType\": \"blob\"`。\n\n\n\n上面的例子由于环境原因没法测试,需要在返回的 header 中配置 `content-type` 和 `Content-Disposition`,比如\n\n\n\n如果接口存在跨域,除了常见的 cors header 外,还需要添加以下 header\n\n\n\n## 倒计时\n\n主要用于发验证码的场景,通过设置倒计时 `countDown`(单位是秒),让点击按钮后禁用一段时间:\n\n\n\n同时还能通过 `countDownTpl` 来控制显示的文本,其中 `${timeLeft}` 变量是剩余时间。\n\n## 跳转链接\n\n### 单页跳转\n\n\n\n**属性表**\n\n| 属性名 | 类型 | 默认值 | 说明 |\n| ---------- | -------- | ---
|