前端纯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()
相关推荐
蜡笔小新星4 分钟前
Flask项目框架
开发语言·前端·经验分享·后端·python·学习·flask
Fantasywt4 小时前
THREEJS 片元着色器实现更自然的呼吸灯效果
前端·javascript·着色器
IT、木易4 小时前
大白话JavaScript实现一个函数,将字符串中的每个单词首字母大写。
开发语言·前端·javascript·ecmascript
Mr.NickJJ5 小时前
JavaScript系列06-深入理解 JavaScript 事件系统:从原生事件到 React 合成事件
开发语言·javascript·react.js
张拭心6 小时前
2024 总结,我的停滞与觉醒
android·前端
念九_ysl6 小时前
深入解析Vue3单文件组件:原理、场景与实战
前端·javascript·vue.js
Jenna的海糖6 小时前
vue3如何配置环境和打包
前端·javascript·vue.js
Mr.NickJJ7 小时前
React Native v0.78 更新
javascript·react native·react.js
星之卡比*7 小时前
前端知识点---库和包的概念
前端·harmonyos·鸿蒙
灵感__idea7 小时前
Vuejs技术内幕:数据响应式之3.x版
前端·vue.js·源码阅读