在React中,你可以使用fetch
或者axios
等库来下载JSON文件。以下是一个示例代码:
import React from 'react';
class DownloadJSON extends React.Component {
handleDownload = () => {
fetch('your_api_endpoint', { method: 'GET' })
.then(response => response.blob())
.then(blob => {
// 创建一个临时的URL对象
const url = window.URL.createObjectURL(new Blob([blob]));
// 创建一个虚拟的a标签,并设置href属性为临时URL对象的值
const link = document.createElement('a');
link.href = url;
// 设置下载文件名
link.setAttribute('download', 'OPHotelListAdvertising_???_240628192348584_240628192348584.json');
// 触发点击事件,开始下载
document.body.appendChild(link);
link.click();
// 下载完成后,清除临时URL和虚拟a标签
document.body.removeChild(link);
window.URL.revokeObjectURL(url);
});
};
render() {
return (
<button onClick={this.handleDownload}>
Download JSON
</button>
);
}
}
export default DownloadJSON;
上述代码通过发送GET请求获取到JSON数据,并将其转换成Blob对象。然后创建一个临时的URL对象,并将其赋值给虚拟的a标签的href属性。接下来,设置下载文件名和触发点击事件即可开始下载。最后,下载完成后清除临时URL和虚拟a标签。
请替换示例代码中的”your_api_endpoint”为实际的API地址。
内容由零声教学AI助手提供,问题来源于学员提问