前端实现数据下载为json文件

数据be like

javascript 复制代码
const res= [{xxx:111,ccc:[]}]

实现:

javascript 复制代码
     const data = JSON.stringify(res, null, 4)
     const file = new Blob([data], { type: 'text/json' })
     const link = document.createElement('a')
     link.download = '名称.json'
     link.href = URL.createObjectURL(file)
     link.click()
     URL.revokeObjectURL(link.href)

JSON.stringify(res, null, 4)很关键,通过它的第三个参数控制缩进的空格数

这里按照四个字符缩进

相关推荐
GISer_Jing几秒前
前端沙箱开源项目推荐(React/Next/Vue优先)
前端·react.js·开源
云水一下4 分钟前
CSS3从零基础到精通(三):动感地带——过渡、动画、变形与响应式
前端·css3
KaMeidebaby36 分钟前
卡梅德生物技术快报|Western Blot 实验应用:肺肠轴机制研究全流程技术解析
前端·数据库·人工智能·算法·百度
达达爱吃肉1 小时前
claude 接入deepseek 运行报错
java·服务器·前端
jingling5551 小时前
Flutter | Dio网络请求实战
android·开发语言·前端·flutter
freeinlife'1 小时前
精准秒表计时器实现---基于js
开发语言·前端·javascript
王文?问1 小时前
ESP32-S3 实战教程:本地语音识别控制 Web 塔防游戏,从固件到前端完整跑通
前端·游戏·语音识别
Hoshizola1 小时前
uniapp与蓝牙设备连接详细步骤
前端·uni-app
优雅格子衫2 小时前
uniapp 拍照相册选取后超级好用的裁剪组件,增加水印完全自定义
开发语言·前端·javascript·uni-app·vue
NiceCloud喜云2 小时前
Claude Code 跑 HyperFrames 实测:本地生成 AI 视频素材全流程
java·运维·人工智能·自动化·json·音视频·飞书