前端纯js导入导出json配置文件

在做后台系统需求的时候,有个需求是需要把当前表单配置导出,在另一个配置项下,导入这些配置,相当于做了一下配置拷贝。通常我们导出下载一个文件,是先向后端发起请求,由后端处理数据后,再返回文件。

调研发现,纯前端也可以实现这样的效果,而且很简单,不需要后端做处理。前端在一次拿到数据后,就可以导出数据到文件。

导出json文件

创建一个a标签,通过a标签的download href属性,可以实现直接下载静态数据,代码如下:

javascript 复制代码
let link = document.createElement('a')
link.download = 'config.json'
link.href = 'data:text/plain,' + JSON.stringify(data)
link.click()
相关推荐
VXbishe6 分钟前
【课程设计】基于SpringBoot的乡村政务服务系统的设计与实现-计算机毕设77011
javascript·vue.js·spring boot·python·php·课程设计·政务
志尊宝12 分钟前
Vue3 零基础每日笔记(037):动手封装 useMouse 与 useWindowSize——事件监听的标准模板
前端·javascript·vue.js·笔记·html5
shmily麻瓜小菜鸡34 分钟前
TDD(测试驱动开发)详解
开发语言·javascript·typescript·node.js·ecmascript
aixingpan1 小时前
aixingpan.cn API开发文档:api_docs_bichart_natalvssolar_return2接口指南
前端·php
八荒启·交互动画1 小时前
Web特效019-Web特效的定义与边界核心算法手写一遍:先跑起来,再谈高级效果
前端·webgl·网页特效·八荒启-交互动画·八荒启
晨枫阳2 小时前
Keycloak 授权体系详解:资源、策略、权限
前端
wcy03102 小时前
POST为什么会发送两次请求
javascript·ajax
志尊宝2 小时前
Vue3 零基础每日笔记(047):动态路由与路由参数——:id 传参、query 传参、props 解耦
前端·javascript·vue.js·笔记·html5
黑马程序员毕设3 小时前
基于微信小程序的二手交易平台设计与实现报告
前端·人工智能·spring boot·后端·考研
cAuth3 小时前
实现一个图形编辑器
前端·架构·计算机图形学