amis button actionType": "copy" 中点击按钮 调用接口获取数据 后拼接页面已有文本 复制demo
时间: 2023-11-23 14:07:01 浏览: 148
您可以通过以下步骤来实现这个功能:
1. 在 `actionType: "copy"` 的按钮中添加 `fetcher` 属性,指定调用接口的函数。例如:
```json
{
"type": "button",
"actionType": "copy",
"label": "复制",
"fetcher": {
"url": "/api/getData",
"method": "GET",
"params": {
"id": "xxx"
}
}
}
```
2. 在 `fetcher` 中指定接口的 URL、请求方法和参数。在 `params` 中定义需要传递的参数。
3. 在调用接口成功后,可以通过 `onSuccess` 属性来指定回调函数。在这个回调函数中,可以获取到接口返回的数据,并将它与页面已有的文本拼接起来。例如:
```json
{
"type": "button",
"actionType": "copy",
"label": "复制",
"fetcher": {
"url": "/api/getData",
"method": "GET",
"params": {
"id": "xxx"
},
"onSuccess": "function(response) {
var data = response.data;
var existingText = document.getElementById('existing-text').value;
var newText = existingText + data;
document.getElementById('existing-text').value = newText;
return Promise.resolve(newText);
}"
}
}
```
4. 在回调函数中获取到接口返回的数据后,可以将它与页面已有的文本拼接起来,然后将新的文本设置回页面中的文本框中。最后,返回一个 Promise 对象,以便于按钮的 `copy` 动作可以正确执行。
以上就是实现这个功能的大致步骤,您可以根据实际情况进行调整和修改。
阅读全文